SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 bug/annoyance. Can someone explain this to me?

    Run this code in IE6:

    HTML Code:
    <div id="box" style="font-size:xx-small;width:200px;height:200px;border:1px black solid;" onmouseout="alert('mouse out');">
    This is a normal DIV with the attribute:<br />
    onmouseout=&quot;alert('mouse out');&quot;<br /><br />
    </div>
    
    <div id="box" style="font-size:xx-small;width:200px;height:200px;border:1px black solid;position:absolute;left:250px;top:250px;" onmouseout="alert('mouse out');">
    This absolutely positioned DIV has the attribute:<br />
    onmouseout=&quot;alert('mouse out');&quot;<br /><br />
    
    Why does the onmouseout Event trigger when I "mouse-out" from a text ON the layer? This doesn't happen when the DIV isn't positioned as absolute.
    </div>
    Is there something I can do against this? Does anyone know this bug/Microsoft feature?

  2. #2
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nevermind, I can't reproduce it now for some reason Oo

    I'll keep you updated

  3. #3
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, download this txt file, and rename it as html.

    The bug only works when I include a Doctype.
    Attached Files Attached Files

  4. #4
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    </head> missing

    HEIGHT: 200px" ("!) missing ;

    2x ID "box"

    Validating html saves a lot of trouble

  5. #5
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by all4nerds
    Hello

    </head> missing

    HEIGHT: 200px" ("!) missing ;

    2x ID "box"

    Validating html saves a lot of trouble
    It still doesn't work.

    Check it out:
    Attached Files Attached Files

  6. #6
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try it in Mozilla or Firefox to see how a DOM-compliant browser handles this. What you are describing is correct event traversal. The event is bubbling up from the text node to its parent container.

    Using a proper doctype causes the browser to shift into standards-compliant mode.

  7. #7
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Firefox handles this "correctly", that is, it doesn't trigger an alert when I remove my mouse from the text.

    So you're saying this is correct behaviour actually?

    I have the Doctype "Loose". When I set it to strict it only gets weirder in IE6: The event triggers when I remove the mouse from the text only, not when I remove it from the layer.

    But I guess these are IE problems, and that's all?


    Thanks Mike (I love X!)

  8. #8
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When I completely remove the Doctype, everything works as expected.

    What I don't understand: you're saying that what I'm experiencing is correct behaviour - why doesn't Firefox handle it the same way then (no matter what doctype I put, strict or loose)?

  9. #9
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hello

    your html is a mess

  10. #10
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I know, I saved it with Internet Explorer and IE made it even more of a mess (for example, put newlines in places where I would never put them, remove quotes from id="someid", capitalize, and other stuff).

    I hope you don't mind too much.

  11. #11
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here you go all4nerds:
    HTML Code:
    <?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
    	<title>IE6 annoyance</title>
    	<meta http-equiv="content-type" 
    		content="text/html;charset=utf-8" />
    	<meta http-equiv="Content-Style-Type" content="text/css" />
    </head>
    
    <body>
    
    	<div style="font-size:xx-small;width:200px;height:200px;border:1px black solid;" onmouseout="alert('mouse out');">
    	This is a normal DIV with the attribute:<br />
    	onmouseout=&quot;alert('mouse out');&quot;<br /><br />
    	</div>
    
    	<div style="font-size:xx-small;width:200px;height:200px;border:1px black solid;position:absolute;left:250px;top:250px;" onmouseout="alert('mouse out');">
    	This absolutely positioned DIV has the attribute:<br />
    	onmouseout=&quot;alert('mouse out');&quot;<br /><br />
    
    	Why does the onmouseout Event trigger when I "mouse-out" from a text ON the layer? This doesn't happen when the DIV isn't positioned as absolute.
    	</div>
    
    </body>
    </html>

  12. #12
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    OK page validates and works as aspected only an alert moving from the DIV

  13. #13
    SitePoint Zealot spybreak's Avatar
    Join Date
    Apr 2003
    Location
    Germany
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're right, thank you.

    Ok, so this is the way it's supposed to be?

    Because Mike said something about event traversal.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •