[WEB4LIB] RE: creating links that use an onmouseover to display more links

[Freeman, Brook J.]

Another resources is Maxdesign, sometimes known as Listamatic, http://css.maxdesign.com.au/index.htm.  One problem with this resource is it generally assumes that the browser you are writing for is CSS2 compliant, with IE isn't.  

If you want to see a working example of drop down CSS div tags with the "Son of Suckerfish" http://www.htmldog.com/articles/suckerfish/dropdowns/ JavaScript work around for IE take a look at http://www.lib.purdue.edu  The first version of Suckerfish was originally published on A List Apart http://www.alistapart.com/articles/dropdowns/

Brook Freeman

-----Original Message-----
From: web4lib at webjunction.org [mailto:web4lib at webjunction.org] On Behalf Of Robert Eiffert
Sent: Monday, 20 December, 2004 10:00 AM
To: Multiple recipients of list
Subject: [WEB4LIB] RE: creating links that use an onmouseover to display more links


There is an article at _A List Apart_, walking through all the coding for that kind of menu.  Drop-Down Menus, Horizontal Style (http://www.alistapart.com/articles/horizdropdowns/).  Bookmarked it this weekend, thinking of using for a redo of my school site.


Robert Eiffert, Librarian
Pacific Middle School, Vancouver WA Pac.egreen.wednet.edu/library Beiffert at egreen wednet edu beiffert.net



> -----Original Message-----
> From: web4lib at webjunction.org 
> [mailto:web4lib at webjunction.org] On Behalf Of John Fitzgibbon
> Sent: Monday, December 20, 2004 3:16 AM
> To: Multiple recipients of list
> Subject: [WEB4LIB] creating links that use an onmouseover to display 
> more links
> 
> Hi,
> 
> On many web pages, moving a mouse over a link causes a div to appear 
> right next to the original link. The newly appeared div contains links 
> allowing for more precise navigation.
> 
> The web page http://www.infotoday.com is a good example of where this 
> is done. Click on the link 'Magazines' on the left and you will see a 
> list of links to magazines appear next to the original link.
> 
> I wish to find a resource, either a web site or a book, which explains 
> how this is done.
> 
> I know that the visibility style of the original div is being changed 
> from hidden to visible using JavaScript and this is done by invoking 
> an onmouseover event handler. Positioning the div right next to the 
> original link is a mystery to me. I assume that positioning is done 
> with JavaScript by making the position of the div equal to 
> this.style.top (the position of the link that has just been clicked 
> on) but I don't see this anywhere in the JavaScript.
> 
> Is there a resource that will walk me through the steps?
> 
> Any ideas would be most welcome.
> 
> Regards
> John
> 
> 
> John Fitzgibbon
> 
> Galway Public Library
> Island House
> Cathedral Square
> Galway
> Ireland
> 
> p: 00 353 91 562471
> f: 00 353 91 565039
> w: http://www.galwaylibrary.ie
> 
> *******************************************************************
> Tá eolas atá príobháideach agus rúnda sa ríomhphost seo
> agus aon iatán a ghabhann leis agus is leis an duine/na daoine sin 
> amháin a bhfuil siad seolta chucu a bhaineann siad. Mura seolaí thú, 
> níl tú údaraithe an ríomhphost nó aon iatán a ghabhann leis a léamh, a 
> chóipáil ná a úsáid. Má tá an ríomhphost seo faighte agat trí 
> dhearmad, cuir an seoltóir ar an eolas thrí aischur ríomhphoist
> agus scrios ansin é le do thoil.
> 
> This e-mail and any attachment contains information which is private 
> and confidential and is intended for the addressee only. If you are 
> not an addressee, you are not authorised to read, copy or use the 
> e-mail or any attachment. If you have received this e-mail in error, 
> please notify the sender by return e-mail and then destroy it.
> *********************************************************************