Skip to main content

Bug Tracker

Side navigation

Ticket #6329: jquery_issue.html


File jquery_issue.html, 1.4 KB (added by eternicode, March 21, 2010 07:19PM UTC)

Self-contained HTML file that demonstrates a bug with hover (mouseenter / mouseleave)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"> </script>
        <script type="text/javascript">
            $(function(){
                function hoverin(){
                    $(this).animate({paddingRight:"+=100px"})
                }
                function hoverout(){
                    $(this).animate({paddingRight:"-=100px"})
                }
                $("#d").hover(hoverin, hoverout)
            })
        </script>
        <style type="text/css">
            #d {
                width:20%;
                position:absolute;
                left:0; top:1em;
                background-color:#CCC;
                color:#000;
                padding:2em;
            }
            #ta {
                width:20%;
                height:300px;
                margin-left:20%;
            }
            #ti {
                vertical-align:top;
                font-size:2em;
                margin-top:4.5em;
            }
        </style>
    </head>
    <body>
        <div id="d">Hover from div to textarea, div to page, page to div, and textarea to div.</div>
        <textarea id="ta"></textarea>
        <input id="ti" type="text"/>
    </body>
</html>

Download in other formats:

Original Format