您的位置：首页 > Web前端 > HTML

用定时器实现逐渐放大层的功能

2012-02-27 16:08 204 查看

<!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">

<head>

<title></title>

<script type="text/javascript">

var showintervalId;

function showDiv() {

showintervalId = setInterval("show()", 100);

}

function show() {

var div1 = document.getElementById("div1");

var olderWidth = div1.style.width;

var olderHeight = div1.style.height;

olderWidth = parseInt(olderWidth, 10);

olderHeight = parseInt(olderHeight, 10);

if (olderWidth >= 200) {

clearInterval(showintervalId);

}

olderWidth = olderWidth + 10;

olderWidth = olderWidth + "px";

olderHeight = olderHeight + 10;

olderHeight = olderHeight + "px";

alert(olderWidth);

div1.style.width = olderWidth;

div1.style.height = olderHeight;

}

</script>

</head>

<body>

<div id="div1" style="border-color: Red; border-style: solid; border-width: 1px;

width: 100px; height: 100px">

中国人爱情自觉的中国人我现在发现电影天堂网站，是有两个网址吗，一个是迅雷下载，一个是快车下载，我怎么一下就是快车呢，怎么才能有迅雷的呢？中国人爱情自觉的中国人

我现在发现电影天堂站，是有两个网址吗，一个是迅雷下载，一</div>

<input type="button" id="" value="放大" onclick="document.getElementById('div1').style.width='200px';document.getElementById('div1').style.height='200px'" />

<input type="button" id="" value="逐渐放大" onclick="showDiv()" />

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： div button function xhtml input html

相关文章推荐

新的分享

章节导航