Nav Question
Hi guys!
I'm trying to make a nav bar like:
http://www.torquayunited.premiumtv.co.uk/
I see that you would use onMouseOver, onMouseOut and onMouseClick but I cannot see how to include the links on the onMouseClick.
My current idea would be to have it like :
<onMouseOver="home.src='homeover.jpg'" onMouseOut="home.src='homeup.jpg'"> <li><a href="home.php">Home</a></li>
<li><a href="anotherlink.htm"></a></li> onMouseClick="home.src='homeup.jpg'">
<IMG SRC="homeup.jpg" NAME="home" BORDER=0 width="120" height="18">
Is it anywhere near close to being right?
Many thanks for your help!
kb posted this at 16:24 — 13th September 2003.
He has: 1,380 posts
Joined: Feb 2002
i did this with the help of necrotic...but heres what you want to do:
create a javascript file, name if whatever you want (.js) with this:
var isIMG = document.images;
function Hover(Arrowname,img) {
document.images(Arrowname).src = '/img/'+img;
}
then in your actual page have your links and images like this:
<script type="text/javascript" language="javascript" src="/mymouseover.js"></script>
<a href="/home.html" alt="[Home]" onmouseover="Hover('image0','/homeon.gif');" onmouseout="Hover('image0','/home.gif');"><img width="120" height="70" src="/img/home.gif" alt="[Home]" id="image0" /></a>
just customize the links. make sure each different image is a different image name.
E.g. the first set of images would be id="image0", the second id="image1", etc. just replace "image0" everywhere you see it with the correct number.
Timewell posted this at 16:38 — 13th September 2003.
They have: 344 posts
Joined: Jun 2002
Yeah that works fine only it doesn't expand for me...is it meant to?
kb posted this at 17:58 — 13th September 2003.
He has: 1,380 posts
Joined: Feb 2002
just a note, the "
expanding? define
Enselic posted this at 18:17 — 13th September 2003.
He has: 18 posts
Joined: Sep 2003
IMHO, such a menu is not functional. I'd prefer the menuitems expanded at loadtime.
Timewell posted this at 20:41 — 13th September 2003.
They have: 344 posts
Joined: Jun 2002
Ok...well I want the menu to when mouseover...you get the image effect. can do that.
But then it's when you click on the button, ie. click Match...it expands.
Like on the Torquay site...
no1golfpro.co.uk - High quality golf equipment at competitive prices.
Abhishek Reddy posted this at 00:24 — 14th September 2003.
He has: 3,348 posts
Joined: Jul 2001
Have a look around http://www.hotscripts.com/JavaScript/Scripts_and_Programs/Navigation/
There are a few ways to do this, and they depend on how you construct the menus... so check out hotscripts and javascriptkit.com for scripts and tutorials using the various methods.
Timewell posted this at 14:05 — 14th September 2003.
They have: 344 posts
Joined: Jun 2002
Thanks for the links.
They have certainly provided some more ideas but does it have to be created using Javascript because I don't really know it too well.
no1golfpro.co.uk - High quality golf equipment at competitive prices.
kb posted this at 22:20 — 14th September 2003.
He has: 1,380 posts
Joined: Feb 2002
oops...sorry! i didn't know that you wanted an expandable menu!
most likely JS or "DHTML" which is basically JS. i would recommend doing something like: http://www.dhtmlcentral.com/script/script.asp?id=25 and then customize it for your images instead of text.
make sure your images are small and/or interlaced, unlike the site you reference to, because they load really slow...and i'm on DSL
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.