animal div

f543711700

浏览: 322894 次
性别:
来自: 成都

最近访客更多访客>>

cfy_kinghy

MarshWinter

wj539h

jahson

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function myshow(targetW,targetH) {
lockSceen();

var div = document.createElement('div');
div.style.position = 'absolute';
div.style.width = 0;
div.style.height = 0;
div.style.left = window.screen.width / 2;
div.style.top = window.screen.height / 2 - 150;

var divContent = '<div onmousedown="move(this)" style="width:570px;height:30px;background:#7294f7;padding-top:10px;padding-left:10px;cursor:move;">';
divContent = divContent + '<font color="black" size="4px" style="font-weight:bold">重要服务器配置</font>';
divContent = divContent + '</div>';

divContent = divContent + '<div style="background:#91c0ff; width:580px;height:370px"></div>';

div.innerHTML = divContent;
div.style.overflow = 'hidden';
document.body.appendChild(div);

window.setInterval(function() {
if(parseInt(div.style.width) < targetW) {
div.style.width = parseInt(div.style.width) + 70;
div.style.left = window.screen.width / 2 - parseInt(parseInt(div.style.width) / 2);
}
if(parseInt(div.style.height) < targetH) {
div.style.height = parseInt(div.style.height) + 60;
div.style.top = (window.screen.height / 2 - 150) - parseInt(parseInt(div.style.height) / 2);
}
},15);
}

function move(childDiv) {
var div = childDiv.parentNode;

div.setCapture();
var offsetX = event.offsetX;
var offsetY = event.offsetY;

div.onmousemove = function() {
div.style.position = 'absolute';
div.style.left = event.clientX - offsetX;
div.style.top = event.clientY - offsetY;
}

div.onmouseup = function() {
div.releaseCapture();
div.onmousemove = null;
div.onmouseup = null;
}
}

function lockSceen() {
div = document.createElement('div');
div.id = 'lockDiv';
div.style.position = 'absolute';
div.style.width = window.screen.width;
div.style.height = window.screen.height;
div.style.top = '0px';
div.style.left = '0px';
div.style.background="#33393C";
div.style.filter="alpha(opacity=10)";
document.body.appendChild(div);

window.setInterval(function() {
if(div.filters.alpha.opacity < 80) {
div.filters.alpha.opacity += 10;
}
},10);
}

</script>
</head>
<body>
<center>
<a href="#" onclick="return myshow(580,400)">动画效果</a>
</center>
</body>
</html>

分享到：