two links by the same image

[mussche]

I have some tumbnalis on my homepage. If you click to this tumbnail, you can see a bigger image in an Iframe. Sometimes you have to scrol to the top to see this. I would like to "tell" to my tumbnail, if you click an image would be loaded in the Iframe an at the same time my homepages jumps to the top.
How can I do this? My homepage can you visit here:
www.fotografie-tips.nl
The tumbnails can you find at links.

A good sollution is welcome.

[WebJoel]

I do not understand what you describe.

You have a a small error here though:<iframe id="InlineFrame1" style="LEFT: 200px; WIDTH: 400px; POSITION: absolute; TOP: 120px; HEIGHT: 300px" marginheight="0"; marginwidth="0" name="frame1" src="images/home.jpg" frameborder= "0">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe> "marginheight: is (proprietary)HTML and does not require a " ; " after it.

[mussche]

thank you for your mail about the error.

I meant that you can see some smal tumbnails at the left side. If you click on these images, a bigger one comes to the iframe. But if you are under the page (last image) after you click you have to scrol up. This is what i do not want. I want that if I click on the tumbnail, the picture appears in the iframe AND the hole page scrolls up automaticly to the top.
How can i do this?

[• MaNiC MoE •]

1st of all, great website ;)!!!
Aha, I think I got what u mean...

U want the user to click on the image and so 1) Its loaded 2) The page is scrolled to the top!

Smart question, but needs thinking... lol






<a href="images/tip1.jpg" target="frame1"><a target="_top"><img alt="laat mij zien!" src="images/tumb1.jpg" border="0" vspace="4"></a></a>


Put the image tag between two <a> tags, the first for the image to load and the second for it to go to the top of the page!


<!-- Tag 1 -->
<a href="images/tip1.jpg" target="frame1">

<!-- Tag 2 -->
<a target="_top">


Hope this works, n' good luck!

[mussche]

I did it at tumbnail 10 but it does not work. Maybe i have done not correctly...:(

[• MaNiC MoE •]

I haven't tested it actually :(
So ain't sure if it'd work, but just try it!

[Ferret]

Here is a version I did for a site some time ago:


This method actually uses mouse-overs to make the change in the larger image view, then makes a pop-up with the image at normal size. If you would prefer the change to happen via click, change the onmouseover to onclick, and take away the href attribute.

In the main page (note that this was before I learned much about CSS... most of this formatting should be done with CSS):

<img src='images/screens/introcutscene.jpg' width='400' name='bigView'><br />
<iframe src="thumb.html" name="nav" width="400" vspace="15" hspace="10" frameborder="0">

In the iframe:
<a href="javascript:imgPop('images/screens/introcutscene.jpg');" onmouseover='parent.document.bigView.src="images/screens/introcutscene.jpg"'>
<img border="0" src="images/screens/thumbs/introcutscene_thumb.jpg" alt="Image Thumbnail" />

<a href="javascript:imgPop('images/screens/guardia.jpg');" onmouseover='parent.document.bigView.src="images/screens/guardia.jpg"'>
<img border="0" src="images/screens/thumbs/guardia_thumb.jpg" alt="Image Thumbnail" />



Hopefully that helps!

edit: here's the javascript of the popup window:

<script language="javascript">
var newWindow;
function imgPop(thisImage)
{


newwindow=window.open(thisImage,'name','width=660 , height=500');
if (window.focus) {newwindow.focus()}
return;

}
</script>

[Lazer]

Hi.
Make sure, you put the Window.Open script in the BODY and NOT int HEAD.
If you put it in the head, most POUP blockiers WILL BLOCK it!
in the BODY, it will usually popup.

[coothead]

Hi there mussche,

place this javascript snippet within the head section of your page...
<script type="text/javascript">
window.onload=function(){
setPageTop();
}
function setPageTop() {
anc=document.getElementById('txtli').getElementsByTagName('a');
for(c=0;c<anc.length;c++) {
anc[c].onclick=function() {
document.body.scrollTop=0;
}
}
}
</script>
coothead

[mussche]

Thank you, this is it!

[coothead]

No problem, you're welcome. ;)