Sign in to follow this  

[web] Premature MouseOut

This topic is 4381 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

http://www.freewebs.com/supaflyfrank/Copy%20of%20Copy%20of%20Fillwork.htm I have a group of divs and span tags and when I go on a menu item they appear. But when I exit out of the sub items I want them to disappear. But the problem I am having is that they disappear as soon as you touch a empty space. Space between the border and the a href tag words. And even spaces between letters. So what I want to know how can I make it hide when I exit out the entire box. The box is actually a div tag that is grouping other div,span,a href tags. The code is at the very bottom which looks like this.
<span onMouseOut = "javascript:hide('help');">

<div id = "help" style = "border : solid 4px #8eaeaf; position:absolute; left : [100];"  >


<span onMouseOver="javascript: ChangeColor('sone','abeaec')" onMouseOut = "javascript:ChangeColor('sone','a5d3e1')">
  <center>
      <div  id="sone" >
         <a id = "menuone"  style=" text-decoration:none; " href="whatever.html">Hey Friend</a>
      </div>
  </center>
      
</span>

<span onMouseOver="javascript: ChangeColor('stwo','abeaec')" onMouseOut = "javascript:ChangeColor('stwo','a5d3e1')">
<center>
      <div  id="stwo" >
         <a id = "menutwo" style=" text-decoration:none; "  href="whatever.html">Hey Friend</a>
      </div>
  </center>
</span>

<span onMouseOver="javascript: ChangeColor('sthree','abeaec')" onMouseOut = "javascript:ChangeColor('sthree','a5d3e1')">
<center>
      <div " id="sthree" >
         <a id = "menuthree" style=" text-decoration:none; "  href="whatever.html">Hey Friend</a>
      </div>
  </center>
</span>

<span onMouseOver="javascript: ChangeColor('sfour','abeaec')" onMouseOut = "javascript:ChangeColor('sfour','a5d3e1')">
  <center> 
      <div " id="sfour" >
         <a id = "menufour" style=" text-decoration:none; "  href="whatever.html">Frienkldsaeraewasjkljk;</a>
      </div>
  </center>   
</span>

</div>
</span>

hide is a function that hides the div <span onMouseOut = "javascript:hide('help');"> is the span tag that I am trying to use to group all the other tags together. I used the span tag because onMouseout for the other divs anytime it reached a empty space aka spaces between letters or spaces between word and the border it reacts to a mouseout. So the span allowed me to group the div and a href treating it as one tag so when i want to mouse out it mouseouts out of the entire div not just the spaces between div border and the ahref tag.

Share this post


Link to post
Share on other sites
cause hover doesnt work on browsers like IE 5 and older browsers. And I need a webpage that will work on IE 4+



<span onMouseOut = "javascript:hide('help');" >
<div id = "help" style = "border : solid 4px #8eaeaf; position:absolute; left : [100];" >





<a id = "menuone" style=" text-decoration:none; " href="whatever.html">Hey Friend</a>



<a id = "menutwo" style=" text-decoration:none; " href="whatever.html">Hey Friend</a>



<a id = "menuthree" style=" text-decoration:none; " href="whatever.html">Hey Friend</a>

<a id = "menufour" style=" text-decoration:none; " href="whatever.html">Frienkldsaeraewasjkljk;</a>




</div>
</span>



also causes a premature mouseout and I dont see how i can group this a href tags. I was able to group them with span before but for somereason it wont work this time.

Share this post


Link to post
Share on other sites

<center >
<div id="sone" onMouseOver="javascript: ChangeColor('sone','abeaec')" onMouseOut = "javascript:ChangeColor('sone','a5d3e1')">
<a id = "menuone" style=" text-decoration:none; " href="whatever.html">Hey Friend</a>
</div>
</center>





function ChangeColor(eitem,color)
{
alert("changing");
document.getElementById(eitem ).style.backgroundColor = "#"+color;

}


if you add this to an html file ChangeColor will fire off the alert twice. Once if you enter any empty space in the div tag. And one if you but your mouse of the links text. How can I make it only fire ONCE? Treat the ahref and div tags as one entity.

Share this post


Link to post
Share on other sites
Not impossible as far as I know, but extremly, extremly difficult, seeing as all of the standarization that went into CSS and javascript really didn't start getting supported until recent generations of browsers.

Trying to get certain pieces of JS or CSS to work on IE 4/5 - NS 4.5+ is more painful than trying to port code from a Mac to Windows. The compatibility just isn't there.

My advice: target newer broswers and go with any pre-existing full-CSS navigation (IE 5.5 is about standard these days, it'll run on any machine that'll run Win98 and up [realize that's 7 years old], and there's just about no reason to not upgrade to IE6 from there). It'll save you a huge headache and for the people who email you to complain, simply set up an autoresponder and send them a link to Mozilla.com (yes .com, Firefox is at Mozilla.com now ;).

Share this post


Link to post
Share on other sites
But I dont think it is a point of standardization. I just think it is a know how situation. There most been someone before who encounter this problem on trying to fire a event inside a div area that contains a a href tag. But didnt want it to fire twice if it just hit empty space in the div tag or hit the text in the ahref tag

Share this post


Link to post
Share on other sites
If you want to know what element caused an event to happen you should use the event object. W3C browsers pass the event object to your event handling function, IE uses window.event.

EDIT: And why are you using the javascript protocol handler (javascript:) in your event handlers? You do know that code written inside things like onmouseover is automatically interpreted as javascript, don't you?

Share this post


Link to post
Share on other sites

This topic is 4381 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this