zoukankan      html  css  js  c++  java
  • 用定时器实现逐渐放大层的功能

    <!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- 1px;
            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>
  • 相关阅读:
    全景转换工具
    Leetcode 215.数组中的第k个最大元素
    Leetcode 214.最短回文串
    Leetcode 213.大家劫舍II
    Leetcode 212.单词搜索II
    Leetcode 211.添加与搜索单词
    Leetcode 209.长度最小的子数组
    Leetcode 208.实现前缀树
    Leetcode 207.课程表
    Leetcode 206.反转链表
  • 原文地址:https://www.cnblogs.com/wangyhua/p/4050678.html
Copyright © 2011-2022 走看看