The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> image pop-up met selecteren
seccondbest
post May 16 2013, 04:56 PM
Post #1





Group: Members
Posts: 9
Joined: 17-November 10
Member No.: 13,167



hallo allemaal ik zit met een vraag waar ik maar geen antwoord op kan vinden, dus kom ik wederom hier heen om hulp te vragen.

wat ik wil:

een image van 100X100 op mijn site, als je op dat image klikt opent een nieuw window met daarin de voledige foto EN aan de zijkant daarvan een aantal kleinere images die allen klikbaar zijn en openen in het window van de grote foto...

verward? lol ja ik dus ook, er is een voorbeeld bijna alle foto's op marktplaats doen ongeveer wat ik wil.

als iemand iets verkoopt kun je op de foto klikken
die gaat dan open in een nieuw window met rechts daarvan een aantal kleine foto's
klik op een van die kleine foto's en je ziet de volledige foto links


wat ik weet van html:

<p> klik op de foto voor het volle formaat</p><a href="naam van de grote foto" target="_blank" style="text-decoration:none">
<img scr="naam kleine foto" width="100"height="100" border="none"></a>

dit werkt natuurlijk niet, maar het geeft misschien een idee waar ik ben met mijn kennis van html.


alle hulp is welkom, alvast bedankt
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post May 17 2013, 05:08 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



Schrijf je vraag in het Engels, iedereen gebruikt dat hier.
Als je dat niet *beep*, dan vertaal ik het wel.

Just asked the OP to write in English. If he/she can't, I offered to translate.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
seccondbest
post May 17 2013, 05:41 AM
Post #3





Group: Members
Posts: 9
Joined: 17-November 10
Member No.: 13,167



sweet, i did my best in dutch but english is no problem so here we go,


What i want:

on my webpage i want to place an image of 100x100, it will be clickable and if you do click on it a new window opens with the full size image with on the side of it more small images that each of them selves are clickable.

it is not an easy task but i have seen it work at marketplace (marktplaats.nl) where sellers have a picture of their item on the website, when clicking on that image it opens up in a new window and on the right there are more images that will enlarge in that new window on mouse over.

I know something about html but not enough to get this to work;


<a href="fullsize image.jpg" target="_blank" text-decoration:none ><img scr="smallimage.jpg" width= "100" height="100"></a>

this is not working but i want to show what i do know about html, its not much so clearly i am in need of help

any help is welcome, thank you
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post May 17 2013, 10:38 AM
Post #4


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



You might try to lookup "lightbox with thumbnails" and then look for those that have the thumbnails inside the lightbox.
Lightbox itself is a javascript to overlay images on top of a page ( http://lokeshdhakar.com/projects/lightbox2/ ). That's, in a way, the case of marktplaats.nl too; only they use some other method that I couldn't figure out.

A few, more or less similar, samples are mentioned here: http://webmasters.stackexchange.com/questi...-inside-the-box
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
seccondbest
post May 17 2013, 02:05 PM
Post #5





Group: Members
Posts: 9
Joined: 17-November 10
Member No.: 13,167



thank you i did do as you suggested and found somethng i could tweak to my liking, however i still have a question left:

this is what i am using:

inside a table,

<a href="images/bankstel.jpg" rel="enlargeimage" rev="targetdiv:loadarea" title=""> <img src="images/bankstel.jpg" width="40" height="40" border="none"></a>


inside a table next to it:

<div id="loadarea" style="width: 100%; height: 100"></div>

I am loading a javascript in my heading and it all works excactly as i would want to, however one thing I can not figure out.

in the above (a href) tag I am using an image of lets say 300X500 just perfect!
if I add an image smaller than i have no problems but if I exceed a specific size it rips my page apart.

I have played with the settings in the table but that does not set a max size for the pictures

is there a standard command to set image size to max .

<div id="loadarea"style="width 100%; height: 100" max img size="300x300"> or something this easy lol

im getting there but still require a lot of help smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
seccondbest
post May 20 2013, 12:13 PM
Post #6





Group: Members
Posts: 9
Joined: 17-November 10
Member No.: 13,167



ok i have this all working, so the next logical step trying to figure out what i am doing wrong with the contact form. but ill let you know if i need help smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 03:26 AM