PDA

View Full Version : Java Drop Down Rollover



notorious200164
01-28-2006, 05:16 PM
Hey guys.

Ok, so I made a drop down menu with my own buttons. Here is an image of the menu
http://img55.imageshack.us/my.php?image=clipboard010ft.gif

K, now when the mouse moves over the Home button it lights up red with the rollover image. When I scroll down the menu to announcements and my mouse arrow goes off of the Home button the rollover disappears. How can I make it so that the home button stays red when the user is still on the below menu?

notorious200164
01-29-2006, 06:17 PM
?????????

jscheuer1
01-29-2006, 07:17 PM
Well, without the code, it is hard to say. I'd try having, as part of the onmouseover event of the drop down, code that highlights Home.

notorious200164
01-29-2006, 07:29 PM
Yeah, I thought it would be part of that before so I tried messing around with different codes but I'm not sure which code to put in?

jscheuer1
01-29-2006, 10:26 PM
Please provide your code -

.

OR:

Put code tags:




code goes here



around your code in a message here so that it appears like so:




code goes here

notorious200164
01-30-2006, 12:08 AM
here is the actually menu code


<script type="text/javascript">

/***********************************************
* AnyLink Drop Down Menu- Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="news.htm" target="content">Announcements</a>'
menu1[1]='<a href="about.htm" target="content">About Us</a>'
menu1[2]='<a href="servers.htm" target="content">Servers</a>'
menu1[3]='<a href="images.htm" target="content">Images</a>'

//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="stats.htm" target="content">Current Stats</a>'
menu2[1]='<a href="challenge.htm" target="content">Challenge Us</a>'
menu2[2]='<a href="dates.htm" target="content">Public Dates</a>'

var menu3=new Array()
menu3[0]='<a href="family.htm" target="content">The Family</a>'
menu3[1]='<a href="codes.htm" target="content">Codes</a>'
menu3[2]='<a href="retired.htm" target="content">Retired</a>'

var menu5=new Array()
menu5[0]='<a href="joinm.htm" target="content">Member</a>'
menu5[1]='<a href="joina.htm" target="content">Associate</a>'
menu5[2]='<a href="joins.htm" target="content">Staff</a>'

var menu6=new Array()
menu6[0]='<a href="linkus.htm" target="content">Link Us</a>'
menu6[1]='<a href="links.htm" target="content">Links</a>'
menu6[2]='<a href="partners.htm" target="content">Partners</a>'

var menuwidth='165px' //default menu width
var menubgcolor='black' //menu bgcolor
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}


function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)

if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}

return clickreturnvalue()
}

function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}

function delayhidemenu(){
if (ie4||ns6)
delayhide=ZywTimeout("hidemenu()",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

</script>


Here is what goes before the rollover image:


<a href="#" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">

notorious200164
02-01-2006, 01:05 AM
??????????????????????

jscheuer1
02-01-2006, 06:00 AM
??????????????????????

My sentiments exactly. I still don't see what you are trying to do with your rollover code. Show it and I may be able to come up with something. Better yet, attach at least the full set of the starting and rollover images for the home button and full code for the page. Best would be to put up a test page somewhere and supply the url.