Search the archives!
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[Javascript] Auto scrolling
- From: javascript@xxxxxxxxxx (BEKIM BACAJ)
- Subject: [Javascript] Auto scrolling
- Date: Thu, 13 Feb 2003 16:42:50 +0100
<html><div style='background-color:'><DIV> <P>No time to go through all the contents, but (this scroll to top; every time you expando- the content, is happening because of the href = #), using <A name="" ... instead of hyper refference might change a lot, but in any other case, you can overrinde this behavior with [expandColapse<EM>object</EM>].scrollintoview command, this will always bring the referenced tag to the view even if it is out of the page margins and the scroll page disabled.</P> <P>I think that the above will solve your problem for good.</P> <P>Cheers<BR><BR></P></DIV> <DIV></DIV> <DIV></DIV>>From: Larry Cotton <LAURENCE.COTTON@xxxxxxxxxxxx> <DIV></DIV>>Reply-To: javascript@xxxxxxxxxx <DIV></DIV>>To: Javascript@xxxxxxxxxx <DIV></DIV>>Subject: [Javascript] Auto scrolling <DIV></DIV>>Date: Thu, 13 Feb 2003 11:19:44 +0000 <DIV></DIV>> <DIV></DIV>>Hi <DIV></DIV>> <DIV></DIV>>I've written a contents page that displays/hides sub-section titles <DIV></DIV>>when you click on a section title. This is done by using the <DIV></DIV>>'display' style property. The problem is whenever you 'open up' a <DIV></DIV>>list of sub sections the browser automatically scrolls to the top of <DIV></DIV>>the screen, so you have to scroll down to see the newly displayed <DIV></DIV>>sub sections. <DIV></DIV>> <DIV></DIV>>Does anyone know how to prevent this scrolling to the top ? <DIV></DIV>> <DIV></DIV>>The code looks somthing like : <DIV></DIV>> <DIV></DIV>>HTML code : consists of a series of divs containing the text for the <DIV></DIV>>title of each section. Each div has an onClick() handler that calls <DIV></DIV>>controlExpand(). This functions hides or displays the sub sections <DIV></DIV>>as appropriate. (Note 1)The top-level sections are put in a table, <DIV></DIV>>so the section expansion occurs within a table cell, 2) the second <DIV></DIV>>column in the table consists of standard href links). <DIV></DIV>> <DIV></DIV>> <TABLE style="WIDTH: 100%; BORDER-TOP-STYLE: outset; BORDER-RIGHT-STYLE: outset; BORDER-LEFT-STYLE: outset; BORDER-BOTTOM-STYLE: outset; DIV: 2" align=center> <DIV></DIV>> <TBODY> <TR> <DIV></DIV>> <TH style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset">Contents</TH> <DIV></DIV>> <TH style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset">Page Link</TH> <DIV></DIV>></TR> <DIV></DIV>> <TR> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> <DIV id=Intro DIV <>>onClick="controlExpand(this, 2)"><A style="COLOR: white; DIV: 24pt" href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#";>Introduction</A></DIV> <DIV></DIV>> <DIV id=Intro_0 style="DISPLAY: none"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 20pt;">Five Kingdoms </DIV>>System</A> <DIV></DIV> <DIV></DIV>> <DIV id=Intro_1 style="DISPLAY: none"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 20pt;">Three Domains </DIV>>System</A> <DIV></DIV> <DIV></DIV>> </TD> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> <DIV id=L_Intro><A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/polIntro.htm"; DIV <>>style="font-size: 24pt;">Introduction</A></DIV> <DIV></DIV>> <DIV id=L_Intro_0 style="DISPLAY: none"> <A DIV <>>href="polIntroWhit.htm" style="font-size: 20pt;">Five Kingdoms </DIV>>Intro</A> <DIV></DIV> <DIV></DIV>> <DIV id=L_Intro_1 style="DISPLAY: none"> <A DIV <>>href="#" style="font-size: 20pt;">Three Domains Intro</A></DIV> <DIV></DIV>> </TD> <DIV></DIV>></TR> <DIV></DIV>> <TR> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> <DIV id=FiveK DIV <>>onClick="controlExpand(this, 1)"><A style="COLOR: white; DIV: 24pt" href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#";>Five Kingdoms</A></DIV> <DIV></DIV>> <DIV id=FiveK_0 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, 1)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 20pt;">Superkingdom: </DIV>>Prokarya</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, 2)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 18pt;">Kingdom: Bacteria</A></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_0 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, 1)"> <A DIV <>>href="#" style="color: white; font-size: 16pt;">Subkingdom: </DIV>>Archaea</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_0_0 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, </DIV>>2)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 14pt;">Division: <DIV></DIV>>Mendosicutes</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_0_0_0> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B1 </DIV>>Euryarchaeota</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_0_0_1> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B2 </DIV>>Crenarchaeota</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, 3)"> <A DIV <>>href="#" style="color: white; font-size: 16pt;">Subkingdom: </DIV>>Eubacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, </DIV>>6)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 14pt;">Division: <DIV></DIV>>Gracilutes</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_0> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B3 </DIV>>Proteobacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_1> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B4 </DIV>>Spirochaetae</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_2> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B5 </DIV>>Cyanobacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_3> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B6 </DIV>>Saprospirae</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_4> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B7 </DIV>>Chloroflexa</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_0_5> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B8 </DIV>>Chlorobia</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_1 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, </DIV>>1)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 14pt;">Division: <DIV></DIV>>Tenericutes</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_1_0> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B9 </DIV>>Aphragmabacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_2 style="DISPLAY: none" DIV <>>onClick="controlExpand(this, </DIV>>5)"> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="color: white; font-size: 14pt;">Division: <DIV></DIV>>Fermicutes</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_2_0> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B10 </DIV>>Endospora</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_2_1> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B11 </DIV>>Pirellulae</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_3_2> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B12 </DIV>>Actinobacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_2_3> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B13 </DIV>>Deinococci</A> <DIV></DIV> <DIV></DIV>> <DIV id=FiveK_0_0_1_2_4> <A DIV <>>href="#" style="color: white; font-size: 14pt;">Phylum: B14 </DIV>>Thermoatogae</A> <DIV></DIV> <DIV></DIV>> </TD> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> <DIV id=L_FiveK><A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 24pt;">Five Kingdoms</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0 style="DISPLAY: none"> <A DIV <>>href="#" style="font-size: 20pt;">Superkingdom: Prokarya</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#";>Kingdom: Bacteria</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_0> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 16pt;">Subkingdom: Archaea</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_0_0> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Division: Mendosicutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_0_0_0> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Phylum: B1 Euryarchaeota</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_0_0_1> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Phylum: B2 Crenarchaeota</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 16pt;">Subkingdom: Eubacteria</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Division: Gracilutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_0> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B3 </DIV>>Proteobacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_1> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B4 Spirochaetae</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_2> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B5 Cyanobacteria</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_3> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B6 Saprospirae</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_4> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B7 Tenericutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_0_5> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B8 Firmicutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_1> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Division: Tenericutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_1_0> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B9 </DIV>>Aphragmabacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_2> <A href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#"; DIV <>>style="font-size: 14pt;">Division: Fermicutes</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_2_0> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B10 Endospora</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_2_1> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B11 Pirellulae</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_3_2> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B12 </DIV>>Actinobacteria</A> <DIV></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_2_3> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B13 Deinococci</A></DIV> <DIV></DIV>> <DIV id=L_FiveK_0_0_1_2_4> <A DIV <>>href="#" style="font-size: 14pt;">Phylum: B14 Thermoatogae</A></DIV> <DIV></DIV>> </TD> <DIV></DIV>></TR> <DIV></DIV>> <TR> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> <DIV id=ThreeD DIV <>>onClick="controlExpand(this, 0)"><A style="COLOR: white; DIV: 24pt" href="http://pv1fd.pav1.hotmail.msn.com/cgi-bin/dasp/EN/rte.asp#";>Three Domains</A></DIV> <DIV></DIV>> </TD> <DIV></DIV>> <TD style="BORDER-RIGHT: 2px outset; BORDER-TOP: 2px outset; BORDER-LEFT: 2px outset; BORDER-BOTTOM: 2px outset"> <DIV></DIV>> </TD> <DIV></DIV>></TR> <DIV></DIV>></TBODY></TABLE> <DIV></DIV>> <SCRIPT language=javascript type=text/javascript><!-- </DIV>>bodyEnd(); </DIV>>//--></SCRIPT> <DIV></DIV>> <DIV></DIV>> <DIV></DIV>>Javascript : <DIV></DIV>> <DIV></DIV>>function controlExpand(obj, noOfKids) <DIV></DIV>>{ <DIV></DIV>> var i = 0; <DIV></DIV>> var idRoot = obj.id; <DIV></DIV>> <DIV></DIV>> for(i=0; i<NOOFKIDS; DIV < i++)>> { <DIV></DIV>> var kid = pele(idRoot + "_" + i); <DIV></DIV>> var linkKid = pele('L_' + idRoot + "_" + i); <DIV></DIV>> <DIV></DIV>> if(kid) <DIV></DIV>> { <DIV></DIV>> if(kid.style.display == 'none') <DIV></DIV>> { <DIV></DIV>> kid.style.display = ''; <DIV></DIV>> linkKid.style.display = ''; <DIV></DIV>> } <DIV></DIV>> else <DIV></DIV>> { <DIV></DIV>> hideChildren(idRoot + "_" + i); <DIV></DIV>> kid.style.display = 'none'; <DIV></DIV>> linkKid.style.display = 'none'; <DIV></DIV>> } <DIV></DIV>> } <DIV></DIV>> } <DIV></DIV>>} <DIV></DIV>> <DIV></DIV>>function hideChildren(parentNm) <DIV></DIV>>{ <DIV></DIV>> var i=0; <DIV></DIV>> var obj; <DIV></DIV>> var linkObj; <DIV></DIV>> do <DIV></DIV>> { <DIV></DIV>> var cldNm = parentNm + '_' + i; <DIV></DIV>> obj = pele(cldNm); <DIV></DIV>> linkObj = pele('L_' + cldNm); <DIV></DIV>> if(obj) <DIV></DIV>> { <DIV></DIV>> hideChildren(cldNm); <DIV></DIV>> obj.style.display = 'none'; <DIV></DIV>> if(!linkObj) { <DIV></DIV>> alert("child ref has no link mapping"); } <DIV></DIV>> else { <DIV></DIV>> linkObj.style.display = 'none'; } <DIV></DIV>> i++; <DIV></DIV>> } <DIV></DIV>> } while(obj); <DIV></DIV>>} <DIV></DIV>> <DIV></DIV>>Cheer <DIV></DIV>>Larry <DIV></DIV>> <DIV></DIV>>_______________________________________________ <DIV></DIV>>Javascript mailing list <DIV></DIV>>Javascript@xxxxxxxxxx <DIV></DIV>>https://lists.LaTech.edu/mailman/listinfo/javascript <DIV></DIV></div><br clear=all><hr>MSN 8 helps <a href="http://g.msn.com/8HMJEN/2743";>ELIMINATE E-MAIL VIRUSES. </a> Get 2 months FREE*.</html>
- Follow-Ups:
- [Javascript] Windows macro virus
- From: Dany Vanderroost
- [Javascript] Auto scrolling
- From: Larry Cotton
- [Javascript] Windows macro virus
- Prev by Date: [Javascript] Auto scrolling
- Next by Date: [Javascript] Javascript error handling using try catch blocks
- Previous by thread: [Javascript] Auto scrolling
- Next by thread: [Javascript] Windows macro virus
- Index(es):