...

View Full Version : "top of page" within div w/overflow:auto?



TheRoper
06-23-2004, 11:43 PM
good morning -

i have a scrollable div (style="overflow:auto") and i want to know if i can put a "top of page" link within the div that will scroll said div to the top, whilst not moving the entire page.

the page in question is located here (http://www.charityadvantage.com/familiesintransitionsantacruz/images/mock2.htm).

also, on a side note, anyone know how i can make the menu links underlined when the cell is rolled over?

thanks in advance...
TheRoper

shlagish
06-24-2004, 12:01 AM
To my knowledge, making the div scroll itself is not possible unless the scrolling device is created by you.
As for the links, they are underlined when I hover them...

homerUK
06-24-2004, 12:02 AM
try using

<a href='#' onclick="document.all['layerName'].scrollTop = 0;">top</a>

as for the hyperlink - not sure to be honest!!

TheRoper
06-24-2004, 02:07 AM
thanks homeruk... that's just what i needed. shlagish, i meant when you hover over the 'cell' that the link is contained in... the bgcolor changes, and i also want the link to be underlined when the cell is hovered over, not just when you hover over the text link itself...

thanks to you both for the replies...

shlagish
06-24-2004, 04:12 AM
oh I see..

<td onmouseover="this.childNodes[0].style.textDecoration='underline';" onmouseout="this,childNodes[0].style.textDecoration='none';" ...
or something like it would work... but then, when you click on the cell, it wont go to that href. A simpler way is to make the anchor span the complete width and height of the cell.
<td....><a style="display: block;"..>..
I think should do it..
if not:
<td...><a style="display: block; width: 100%; height: 100%;"...>...

Tell me if any of that works, I'll help you out with the details afterwards :)
you might wanna check this out:
http://css.maxdesign.com.au/listutorial/horizontal_master.htm
it does what your doing, but without a table... much less messy code. it's css based, anyways, hope I could help a bit.

edit: I went to test a couple things..
best way to do it really is to give an id to the tr that contains your links, let's say id="navigation"
then in your stylesheet:
#navigation a { display: block; }
#navigation a:hover { text-decoration: underline; }

TheRoper
06-24-2004, 05:13 AM
:thumbsup: shlagish... right on! thanks for all the help and the reference...

here's what i did in the header:



<SCRIPT LANGUAGE="javascript" TYPE="text/javascript"><!--

function menuOver(obj)
{
(obj).childNodes[0].style.textDecoration='underline';
}

function menuOut(obj)
{
(obj).childNodes[0].style.textDecoration='none';
}

//--></SCRIPT>


then, in the body:



<td onMouseover="menuOver(this)" onMouseout="menuOut(this)"
onClick="window.location='/aboutus.htm'"...>
<a href="/aboutus.htm">ABOUT US</a></td>


note the onClick="window.location='/aboutus.htm'" in the td to solve the problem of clicking on the cell to follow the link.

thanks again for all of your help... it is much appreciated... :)

shlagish
06-24-2004, 10:31 PM
Although this works, I would highly suggest simply adding
#navigation a { display: block; }
It is simpler, less code-bloating, not javascript dependant and offers the same possibilities..
Your choice, but that's what I'd do..



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum