Test Case Boilerplate

Fork this way...

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<title>Demo</title>
</head>
<body>
    <div id="container">
        <input type="button" value="Click me to see the bug" id="tester" />
       <div id="swf"> 
        <object width="400" height="233"><param name="movie" value="http://www.youtube.com/v/aYAGB11YrSs?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/aYAGB11YrSs?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="400" height="233" allowscriptaccess="always" allowfullscreen="true"></embed></object>
    </div>    
   
</body>
</html>

CSS

body, html {        
        min-height: 100%;
        margin:0;
        padding:0;
        background-color:white;
    }
    
    #container {        
        width:980px;     
        margin:0 auto;              
    }    
    
#swf
{
    float:left;
}

#tester
{
    margin-left:20px;
}

JavaScript

$('#tester').click(function(){                    
            
                if(document.getElementsByTagName('html')[0].style.position != "relative")
                {
                    
                    //document.getElementsByTagName('html')[0].style.position = "relative";                    
                    jQuery('html').css('position','relative');                    
                }    
                else
                {
                    //document.getElementsByTagName('html')[0].style.position = "absolute";                    
                     jQuery('html').css('position','absolute');                    
                }
                
            
            });