<html>
<head>
<title></title>
<script type="text/javascript">
var slideSpeed = 20;
/////////////////////////////////////////////
//// Find out window width and height ////
/////////////////////////////////////////////
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
windowWidth = self.innerWidth;
windowHeight = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
//////////////////////////////////////////////
function myDiv(){
var myDiv = document.getElementById('pole');
myDiv.style.width = windowWidth+'px';
if(slideSpeed<=150){
var raz = -150+slideSpeed;
slideSpeed++;
myDiv.style.top = raz+'px';
var myTime = setTimeout("myDiv()", 1);
}
else{
clearTimeout(myTime);
}
}
function disable(){
var myDiv = document.getElementById('pole');
if(slideSpeed>=0){
var raz = -150+slideSpeed;
slideSpeed--;
myDiv.style.top = raz+'px';
}
setTimeout("disable()", 1);
}
</script>
<style type="text/css">
* {
margin : 0;
padding : 0 ;
}
#pole {
background : #ffff00 ;
position : absolute ;
top:-150px;
left : 0 ;
height : 150px ;
}
</style>
</head>
<body>
<a href="javascript:;" onClick="myDiv()">Press Here</a>
<div id="pole" onClick="disable()">Your DIV</div>
</body>
</html>
