I have implemented a "scroll to anchor" in the onLoad of my page which works well in Firefox but doesn't function at all in IE.

I then created a new page and added a Scroller Genie, added a named link in the content (just inserted it in the existing 'sample' content), and added a HREF outside the scroller. Used the scroller behaviour to set up the scroll to named link. Again this worked in Firefox but not IE.

Is there a known issue?

Using Firefox 1.5, IE 6, Dreamweaver 8 on a machine running XP.

Any help appreciated. Alternatively if there is a 'working in IE' page that I could browse to (to make sure it's not my IE) then that'd be helpful too.

Rgds,
Phil

I should add, this is a horizontal scroller and not a vertical one...

Just tried creating a new page (after looking at your demo at www.dmxzone.com/demo/sg/demo9.htm in IE and seeing that it worked) and it worked with a vertical scroller. So seems to be a problem in IE with a horizontal scroller...

Are you able to try creating a simple horizontal scroller for yourself and seeing if you can get it to work in IE - works fine in Firefox!

Rgds,
Phil

<BLOCKQUOTE id=quote><font size=1 face="Verdana, Arial, Helvetica" id=quote>quote:<hr height=1 noshade id=quote>
I should add, this is a horizontal scroller and not a vertical one...

Just tried creating a new page (after looking at your demo at www.dmxzone.com/demo/sg/demo9.htm in IE and seeing that it worked) and it worked with a vertical scroller. So seems to be a problem in IE with a horizontal scroller...

Are you able to try creating a simple horizontal scroller for yourself and seeing if you can get it to work in IE - works fine in Firefox!
<hr height=1 noshade id=quote></BLOCKQUOTE id=quote></font id=quote><font face="Verdana, Arial, Helvetica" size=2 id=quote>
Hi Phil,

Just tried it myself with a horizontal scroller with images, and it worked just fine in both IE and Firefox.
Can you show me your page?

--
Marja de Vroed
www.clubwebware.nl
www.prikhetop.nl
www.flevooware.nl/dreamweaver/

You can see it at ssanz.philduhs.com/photos/index.html

I'm encouraged it worked for you - must just be something I did!

Phil

Two quotes from your page:
<pre id=code><font face=courier size=2 id=code>dmxFSG25('photo_' + selectedPhoto);</font id=code></pre id=code>
<pre id=code><font face=courier size=2 id=code>&lt;script language="javascript" type="text/javascript"&gt;var selectedPhoto = 1;&lt;/script&gt;;</font id=code></pre id=code>
From the above code, as far as I can tell the selected photo onLoad is always nr. 1.
And that's indeed where the scroller is positioned, in both IE and Firefox.

What would you expect to happen on this page?

--
Marja de Vroed
www.clubwebware.nl
www.prikhetop.nl
www.flevooware.nl/dreamweaver/

Sorry, should have said, this page is dynamic so the "1" gets replaced by the ID of whatever picture is displayed.

Here is the source of the page...

-----------------------------------------------------

&lt;%@ include file="/WEB-INF/jsp/includes/taglibs.jspf" %&gt;

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /&gt;
&lt;title&gt;SSANZ - Photos&lt;/title&gt;
&lt;link href="/stylesheets/ssanz.css" rel="stylesheet" type="text/css" media="all" /&gt;
&lt;script language="javascript" type="text/javascript" src="/javascript/ssanz.js"&gt;&lt;/script&gt;
&lt;script language="javascript" type="text/javascript" src="/javascript/ScrollerGenie.js"&gt;&lt;/script&gt;
&lt;style type="text/css"&gt;
#dmx1IFrame {position:absolute; top:-10px; left:-10px;}
#dmx1Scroller {position:relative; width:672px; height: 125px; visibility:visible; overflow:hidden; margin-left:auto; margin-right:auto;}
#dmx1Back {position:absolute; left:4px; top:100px; width:25px;}
#dmx1Slider {position:absolute; left:33px; top:100px; width:610px;}
#bg1Slider {background-image:url(/images/0011hscroller.gif); background-repeat:repeat-x; }
#dmx1Thumb {position:absolute; left:33px; top:100px; width:39px; height:25px;}
#dmx1Forth {position:absolute; left:643px; top:100px; width:25px;}
#dmx1Container {position:absolute; left:2px; top:6px; width:660px; height:100px; visibility:visible; clip:rect(0px 660px 100px 0px); overflow:hidden; }
.dmx1Content {position:absolute; left:0px; top:0px;}
#dmx1Content1 {position:absolute; left:0px; top:0px; }
&lt;/style&gt;
&lt;/head&gt;
&lt;body onload="genericOnload(); dmxFSG1(1,0,2,1,0,0,0,0,'',0,0,0,1); MM_preloadImages('/images/0011hscrllleft_over.gif','/images/0011hscrllright_over.gif'); dmxFSG25('photo_' + selectedPhoto);" onresize="resizePage();"&gt;
&lt;div id="page"&gt;
&lt;div id="header"&gt;
&lt;jsp:include page="/WEB-INF/jsp/includes/header.jsp" /&gt;
&lt;/div&gt;
&lt;div id="pageContent" class="verticalBarRight"&gt;

&lt;div id="lhsAndMiddleColumn" class="column"&gt;
&lt;c:forEach var="photoAlbum" items="${photoAlbums}" varStatus="status"&gt;
&lt;c:if test="${photoAlbum.photoAlbumId == param.photoAlbumID || (param.photoAlbumID == null && status.first)}"&gt;
&lt;c:set var="displayedAlbum" value="${photoAlbum}"/&gt;
&lt;c:forEach var="photo" items="${photoAlbum.photos}" varStatus="status"&gt;
&lt;c:if test="${photo.photoId == param.photoID || (param.photoID == null && status.first)}"&gt;
&lt;script language="javascript" type="text/javascript"&gt;var selectedPhoto = ${photo.photoId};&lt;/script&gt;
&lt;c:set var="displayedPhoto" value="${photo}"/&gt;
&lt;h1&gt;${displayedPhoto.name} &lt;span class="imageCount"&gt;${status.count} of ${fn:length(photoAlbum.photos)}&lt;/span&gt;&lt;/h1&gt;
&lt;div class="fullPhoto"&gt; &lt;img src="/&lt;fmt:message key="relPath_photosImages" /&gt;/gallery_${photoAlbum.photoAlbumId}/${photo.imageFile}" alt="${photo.name}"/&gt;
&lt;div class="caption" style="margin-top:8px;"&gt;${displayedPhoto.caption}&lt;/div&gt;
&lt;/div&gt;
&lt;/c:if&gt;
&lt;/c:forEach&gt;
&lt;div class="photoThumbnails"&gt;
&lt;iframe name="dmx1IFrame" id="dmx1IFrame" src="about:blank" width="0" height="0"&gt;&lt;/iframe&gt;
&lt;div id="dmx1Scroller"&gt; &lt;img src="/images/shim.gif" alt="" width="672" height="141" border="0" /&gt;
&lt;div id="dmx1Back"&gt;&lt;a href="javascript:;" onmousedown="dmxFSG2(1,1);" onmouseup="dmxFSG3(1);" onclick="return false;" onkeydown="dmxFSG2(1,1);" onkeyup="dmxFSG3(1);" onmouseover="MM_swapImage('img1Back','','/images/0011hscrllleft_over.gif',1)" onmouseout="MM_swapImgRestore()"&gt;&lt;img src="/images/0011hscrllleft_up.gif" alt="Scroll Left" width="25" height="25" name="img1Back" border="0" /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div id="dmx1Slider"&gt;
&lt;table width="614" border="0" cellspacing="0" cellpadding="0"&gt;
&lt;tr&gt;
&lt;td id="bg1Slider"&gt;&lt;img src="/images/shim.gif" alt="" width="614" height="25" border="0" /&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
&lt;/div&gt;
&lt;div id="dmx1Thumb"&gt;&lt;a href="javascript:;"&gt;&lt;img src="/images/0011hthumb.gif" alt="Drag to Scroll Left/Right" width="39" height="25" name="img1Thumb" border="0" /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div id="dmx1Forth"&gt;&lt;a href="javascript:;" onmousedown="dmxFSG2(1,0);" onmouseup="dmxFSG3(1);" onclick="return false;" onkeydown="dmxFSG2(1,0);" onkeyup="dmxFSG3(1);" onmouseover="MM_swapImage('img1Forth','','/images/0011hscrllright_over.gif',1)" onmouseout="MM_swapImgRestore()"&gt;&lt;img src="/images/0011hscrllright_up.gif" alt="Scroll Right" width="25" height="25" name="img1Forth" border="0" /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div id="dmx1Container"&gt;
&lt;div id="dmx1Content1" class="dmx1Content" onMouseWheel="dmxFSG4(1)"&gt;
&lt;table&gt;
&lt;tr&gt;
&lt;td nowrap&gt;
&lt;c:forEach var="photo" items="${displayedAlbum.photos}"&gt;
&lt;a name="photo_${photo.photoId}"&gt;&lt;/a&gt;
&lt;c:choose&gt;
&lt;c:when test="${photo.photoId == displayedPhoto.photoId}"&gt;
&lt;img src="/&lt;fmt:message key="relPath_photosImages" /&gt;/gallery_${photoAlbum.photoAlbumId}/${photo.thumbnailImageFile}" alt="${photo.name}" class="thumbnailPhoto selectedPhoto"/&gt;
&lt;/c:when&gt;
&lt;c<img src=../images/dmxzone/forum/icon_smile_shock.gif border=0 align=middle>therwise&gt;
&lt;a href="index.html?photoAlbumID=${photoAlbum.photoAlbumId}&photoID=${photo.photoId}"&gt;&lt;img src="/&lt;fmt:message key="relPath_photosImages" /&gt;/gallery_${photoAlbum.photoAlbumId}/${photo.thumbnailImageFile}" alt="${photo.name}" class="thumbnailPhoto"/&gt;&lt;/a&gt;
&lt;/c<img src=../images/dmxzone/forum/icon_smile_shock.gif border=0 align=middle>therwise&gt;
&lt;/c:choose&gt;
&lt;/c:forEach&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;
&lt;/c:if&gt;
&lt;/c:forEach&gt;
&lt;/div&gt;

&lt;div id="rhsColumn" class="column"&gt;
&lt;h1&gt;Photo Album Index&lt;/h1&gt;
&lt;c:forEach var="photoAlbum" items="${photoAlbums}"&gt;
&lt;ul&gt;
&lt;li type="square" class="rhsNav &lt;c:if test="${photoAlbum.photoAlbumId == displayedAlbum.photoAlbumId}"&gt;, rhsNavHighlight&lt;/c:if&gt;"&gt;&lt;a href="index.html?photoAlbumID=${photoAlbum.photoAlbumId}"&gt;${photoAlbum.name}&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/c:forEach&gt;
&lt;/div&gt;
&lt;div class="clearBoth"&gt;&lt;/div&gt;

&lt;/div&gt;
&lt;div class="clearBoth"&gt;&lt;/div&gt;
&lt;div id="footer"&gt;
&lt;%@ include file="/WEB-INF/jsp/includes/footer.jspf" %&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;

<BLOCKQUOTE id=quote><font size=1 face="Verdana, Arial, Helvetica" id=quote>quote:<hr height=1 noshade id=quote>
Sorry, should have said, this page is dynamic so the "1" gets replaced by the ID of whatever picture is displayed.
<hr height=1 noshade id=quote></BLOCKQUOTE id=quote></font id=quote><font face="Verdana, Arial, Helvetica" size=2 id=quote>
But how do I get it to select another default image than the 1st one?

--
Marja de Vroed
www.clubwebware.nl
www.prikhetop.nl
www.flevooware.nl/dreamweaver/

If you click on any one of the other thumbnail photos (ie. in the scroller) then it will change the image the scroller should scroll to when loaded.

<BLOCKQUOTE id=quote><font size=1 face="Verdana, Arial, Helvetica" id=quote>quote:<hr height=1 noshade id=quote>
If you click on any one of the other thumbnail photos (ie. in the scroller) then it will change the image the scroller should scroll to when loaded.
<hr height=1 noshade id=quote></BLOCKQUOTE id=quote></font id=quote><font face="Verdana, Arial, Helvetica" size=2 id=quote>
Okay, I see it happening (or rather not happening) now.

Try wrapping the thumbnails in their anchoring A tag.
So do:
<pre id=code><font face=courier size=2 id=code>&lt;a name="photo_8"&gt;&lt;img src="/images/photosImages//gallery_1/raftingUp_thumbnail.jpg" alt="Rafting Up" class="thumbnailPhoto selectedPhoto"/&gt;&lt;/a&gt;</font id=code></pre id=code>
rather than:
<pre id=code><font face=courier size=2 id=code>&lt;a name="photo_8"&gt;&lt;/a&gt;&lt;img src="/images/photosImages//gallery_1/raftingUp_thumbnail.jpg" alt="Rafting Up" class="thumbnailPhoto selectedPhoto"/&gt;</font id=code></pre id=code>

--
Marja de Vroed
www.clubwebware.nl
www.prikhetop.nl
www.flevooware.nl/dreamweaver/


Edited by - MarjaR on 05 May 2006 00:46:40

Thanks Marja, that works!

Should have tried that but was a bit discouraged by having an &lt;A HREF...&gt; around some of the photos already. Fortunately it's only the photo without the &lt;A HREF (ie. the one that's being viewed at full size) that I want to jump to anyway so that can have (as you say) the &lt;A NAME...&gt; tag around it.

Actually will see if giving an existing &lt;A HREF...&gt; a name will allow me to jump to it as well. Now I've decided I really want to jump to the thumbnail 2 before the one being shown (so the one being shown is in the middle of the scroller).

Will update this with what I find out in case it's helpful for other people in the future.

Thanks again,
Phil

Yes, that works too - adding a NAME to an existing &lt;A HREF...&gt; will allow me to jump to it.

Awesome - ScrollerGenie does exactly what I wanted it to!!

Phil

<BLOCKQUOTE id=quote><font size=1 face="Verdana, Arial, Helvetica" id=quote>quote:<hr height=1 noshade id=quote>
Yes, that works too - adding a NAME to an existing &lt;A HREF...&gt; will allow me to jump to it.

Awesome - ScrollerGenie does exactly what I wanted it to!!
<hr height=1 noshade id=quote></BLOCKQUOTE id=quote></font id=quote><font face="Verdana, Arial, Helvetica" size=2 id=quote>
That's great! Enjoy! <img src=../images/dmxzone/forum/icon_smile.gif border=0 align=middle>

--
Marja de Vroed
www.clubwebware.nl
www.prikhetop.nl
www.flevooware.nl/dreamweaver/