六合开奖结果现场直播欢迎诸位!收藏本站注 册登 陆
常用三肖中特马:基础知识网络知识操作系统WPS网页制作数据库算法网页成功之路网络安全最新技术古典mid流行midmid背景下载中心
您现在的位置:首页 > 三肖中特马 > 文章页

JS使用定时器修改DIV的高度和宽度

Admin | 2015-5-31 6:11:11 | ReadNums | 3679 | 标签 网页制作 | 打印本页
     

  一、div对象在页面中的标签如下

  <div id="GetDiv" style="border-width:1px; border-style:dotted; width:1000px; overflow:hidden;">
    这里是div里面的内容
  </div>

  二、JS代码如下

  function SetDiv()
  {
    var GetDiv = document.getElementById("GetDiv");
    //alert(GetDiv.getBoundingClientRect().left+","+GetDiv.getBoundingClientRect().top);
    var scale=GetDiv.offsetWidth/GetDiv.offsetHeight;//原来的DIV的高宽比例
    ChangeWH=setInterval("SetWH("+scale+")", 100);

  }
  function SetWH(scale)
  {
    var MoveSpeed=50;//每次改变的大小为N个像素
    var div1 = document.getElementById("GetDiv");
    var oldwidth = div1.offsetWidth;
    oldwidth = oldwidth-MoveSpeed;
    var oldheight = oldwidth/scale;
    if (oldwidth <= 100)
    {
      clearInterval(ChangeWH);//停止计时器
    }else
    {
      div1.style.width = oldwidth + "px";
      div1.style.height = oldheight + "px";
    }
  }


问题未解决:在线咨询

网友评论

(访客)
内容实用原创,讲得很好。
20xx年x月x日
(站长)
有问题请在线咨询。
20xx年x月x日