5 replies [Last post]
Excavator
Excavator's picture
Offline
Enthusiast
Alaska
Last seen: 6 years 6 weeks ago
Alaska
Timezone: GMT-9
Joined: 2004-04-04
Posts: 121
Points: 60

I have a simple thumbnail page - http://www.nopeople.com/homepage/2002_ram/2002_ram.htm

If you scroll down a bit and click on a thumb the picture comes up fine but the thumbnails all snap back to their starting position.

How do I stop the thumbs so they will stay where you scroll them? I can't even think where to look for this! It must be late.

Thanks in advance!!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 12 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Content snaps back up

Hi

I think it is because each thumbnail is loaded from a <a href link where the href="#" which instructs the browser to go to bookmark #, which as it doesn't exist goes to the top of the page.

Also, change the image name to avoid difficult characters like ' and spaces, or add the % equivalants when putting them in the css. Some of your thumbnails seem rather dark too, and the background needs making a light blue, like #ADD8E6, rather than blue.

an example:

<a href="#" onClick="MM_openBrWindow('pages/%2702%20Dodge%20Ram1.htm','','width=800,height=600,screenX=50,screenY=50,top=50,left=50')"><img src="thumbnails/'02 Dodge Ram1_tn.jpg" border="0"></a> So, instead, make this a div like this:

<style type="text/css">
#imageholder1 {
position:relative;
overflow:hidden;
width:200px;
height:150px;
background-image:url('thumbnails/%2702%20Dodge%20Ram1_tn.jpg');
border:0;
}
</style>

and in the body

<div id="imageholder1" onClick="MM_openBrWindow('pages/%2702%20Dodge%20Ram1.htm','','width=800,height=600,screenX=50,screenY=50,top=50,left=50')">&nbsp;</div>

I haven't tried this, but the idea is there, so you may have to play with it.

Trevor

Excavator
Excavator's picture
Offline
Enthusiast
Alaska
Last seen: 6 years 6 weeks ago
Alaska
Timezone: GMT-9
Joined: 2004-04-04
Posts: 121
Points: 60

Content snaps back up

Wow ClevaTreva! Thanks for the help! And for the fast answer... I've stayed up till 3am working on this.
Your code worked perfectly, not much tweaking at all.

The only thing missing now is the mouse cursor does not change for the thumbnails... it stays an arrow. That's another one I've never run into... but it's time for bed now.

Thanks again Cleva, you've been a great help!!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 12 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Content snaps back up

Excavator wrote:
Wow ClevaTreva! Thanks for the help! And for the fast answer... I've stayed up till 3am working on this.
Your code worked perfectly, not much tweaking at all.

The only thing missing now is the mouse cursor does not change for the thumbnails... it stays an arrow. That's another one I've never run into... but it's time for bed now.

Thanks again Cleva, you've been a great help!!

Hi

Sorry about the mouse thing, forgot to add the code!

onmouseover="this.style.cursor='pointer'" should do it

Trevor

Excavator
Excavator's picture
Offline
Enthusiast
Alaska
Last seen: 6 years 6 weeks ago
Alaska
Timezone: GMT-9
Joined: 2004-04-04
Posts: 121
Points: 60

Content snaps back up

Very cool! That works great.
I knew it must have been an onmouseover attribute but I sure could not find it.

Once again, thankyou very much Cleva!

<!-- Edit: OOps... I spoke too soon. The mouse over worked but it broke the link and the pictures would not load anymore. I must have put it in the wrong place. -->

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 12 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Content snaps back up

Excavator wrote:
OOps... I spoke too soon. The mouse over worked but it broke the link and the pictures would not load anymore. I must have put it in the wrong place.

Hi

Did you put it in the html div tags for each thumbnail (not the css style)?

It might need an onmouseout="this.style.cursor='default'" too to unset the hand when the mouse moves away. (might need auto instead of default.

Trevor