JS广告

最新推荐文章于 2021-11-29 21:04:05 发布

xiongxyt2

最新推荐文章于 2021-11-29 21:04:05 发布

阅读量825

点赞数

分类专栏： JQuery 文章标签： function div 浏览器 border 网络 null

本文链接：https://blog.csdn.net/xiongxyt2/article/details/7165578

版权

JQuery 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

横向左右来回移动

<head runat="server">
<title>hello</title>
</head>
<body>
    <div id="floatdiv" style="width: 150px; height: 150px;">
        <a href="#" οnmοuseοver="floatStop();" οnmοuseοut="floatStart();" style="border: 0px;">
            尊敬的客户： 您好！为了给客户提供更优质的服务，网络运营商于2012年1月1日中午12：00-18：00进行网络维护，届时我司的xx服务系统网页将会打不开。给您带来不便，敬请谅解。
            xxx科技有限公司 2011-12-30 </a>
    </div>
</body>
</html>

<script type="text/javascript">


function floatStop(){window.clearInterval(oTimer);}
function floatStart()
{
 oTimer=setInterval(function(){imagemove


("floatdiv");},10);
 }


var oTimer=null;
var by=false;//用于判断是否到达Y坐标底部
var bx=false;//用于判断是否到达X坐标最右侧

var MoveWidth=3;
var MoveHeight=1;
function imagemove( divName)
{


 var winWidth=document.documentElement.clientWidth-10;//获取浏览器宽度
 var winHeight=document.documentElement.clientHeight;//获取浏览器高度
 
 var winLeft=document.documentElement.scrollLeft;
 var winTop=document.documentElement.scrollTop;
 
 var divVar=document.getElementById(divName);//第一Div变量
 var divWidth=divVar.clientWidth;//获取div的宽度
 var divHeight=divVar.clientHeight;//获取div的高度
 var divLeft=divVar.offsetLeft;//获取div的左边距
 var divTop=divVar.offsetTop;//获取div的顶部边距
 divVar.style.position="absolute";//生成绝对定位的元素
 

 if(divLeft<=winLeft)
 {
  divLeft=winLeft;
  MoveWidth=Math.abs(MoveWidth);
  }
 if(divLeft>=winLeft+winWidth-divWidth)
 {
  divLeft=winLeft+winWidth-divWidth;
  MoveWidth=-Math.abs(MoveWidth);
  }
    
 divVar.style.left=divLeft+MoveWidth+"px";
 }
 oTimer=null;
 oTimer=setInterval(function(){imagemove("floatdiv");},10);


</script>

上下来回移动

<head runat="server">
<title>hello</title>
</head>
<body>
    <div id="floatdiv" style="width: 150px; height: 150px;">
        <a href="#" οnmοuseοver="floatStop();" οnmοuseοut="floatStart();" style="border: 0px;">
            尊敬的客户： 您好！为了给客户提供更优质的服务，网络运营商于2012年1月1日中午12：00-18：00进行网络维护，届时我司的xx服务系统网页将会打不开。给您带来不便，敬请谅解。
            xxx科技有限公司 2011-12-30 </a>
    </div>
</body>
</html>

<script type="text/javascript">


function floatStop(){window.clearInterval(oTimer);}
function floatStart()
{
 oTimer=setInterval(function(){imagemove


("floatdiv");},10);
 }


var oTimer=null;
var by=false;//用于判断是否到达Y坐标底部
var bx=false;//用于判断是否到达X坐标最右侧

var MoveWidth=3;
var MoveHeight=1;
function imagemove( divName)
{


 var winWidth=document.documentElement.clientWidth-10;//获取浏览器宽度
 var winHeight=document.documentElement.clientHeight;//获取浏览器高度
 
 var winLeft=document.documentElement.scrollLeft;
 var winTop=document.documentElement.scrollTop;
 
 var divVar=document.getElementById(divName);//第一Div变量
 var divWidth=divVar.clientWidth;//获取div的宽度
 var divHeight=divVar.clientHeight;//获取div的高度
 var divLeft=divVar.offsetLeft;//获取div的左边距
 var divTop=divVar.offsetTop;//获取div的顶部边距
 divVar.style.position="absolute";//生成绝对定位的元素
 

 if(divTop<=winTop)
 {
  divTop=winTop;
  MoveHeight=Math.abs(MoveHeight);
  }
 if(divTop>=winTop+winHeight-divHeight)
 {
  divTop=winTop+winHeight-divHeight;
  MoveHeight=-Math.abs(MoveHeight);
  }

    
 divVar.style.top=divTop+MoveHeight+"px";
    
 }
 oTimer=null;
 oTimer=setInterval(function(){imagemove("floatdiv");},10);


</script>

上下左右来回移动

<head runat="server">
<title>hello</title>
</head>
<body>
    <div id="floatdiv" style="width: 150px; height: 150px;">
        <a href="#" οnmοuseοver="floatStop();" οnmοuseοut="floatStart();" style="border: 0px;">
            尊敬的客户： 您好！为了给客户提供更优质的服务，网络运营商于2012年1月1日中午12：00-18：00进行网络维护，届时我司的xx服务系统网页将会打不开。给您带来不便，敬请谅解。
            xxx科技有限公司 2011-12-30 </a>
    </div>
</body>
</html>

<script type="text/javascript">


function floatStop(){window.clearInterval(oTimer);}
function floatStart()
{
 oTimer=setInterval(function(){imagemove


("floatdiv");},10);
 }


var oTimer=null;
var by=false;//用于判断是否到达Y坐标底部
var bx=false;//用于判断是否到达X坐标最右侧

var MoveWidth=3;
var MoveHeight=1;
function imagemove( divName)
{


 var winWidth=document.documentElement.clientWidth-10;//获取浏览器宽度
 var winHeight=document.documentElement.clientHeight;//获取浏览器高度
 
 var winLeft=document.documentElement.scrollLeft;
 var winTop=document.documentElement.scrollTop;
 
 var divVar=document.getElementById(divName);//第一Div变量
 var divWidth=divVar.clientWidth;//获取div的宽度
 var divHeight=divVar.clientHeight;//获取div的高度
 var divLeft=divVar.offsetLeft;//获取div的左边距
 var divTop=divVar.offsetTop;//获取div的顶部边距
 divVar.style.position="absolute";//生成绝对定位的元素
 

  if(divTop<=winTop)
 {
  divTop=winTop;
  MoveHeight=Math.abs(MoveHeight);
  }
 if(divTop>=winTop+winHeight-divHeight)
 {
  divTop=winTop+winHeight-divHeight;
  MoveHeight=-Math.abs(MoveHeight);
  }
 if(divLeft<=winLeft)
 {
  divLeft=winLeft;
  MoveWidth=Math.abs(MoveWidth);
  }
 if(divLeft>=winLeft+winWidth-divWidth)
 {
  divLeft=winLeft+winWidth-divWidth;
  MoveWidth=-Math.abs(MoveWidth);
  }
    
 divVar.style.top=divTop+MoveHeight+"px";
 divVar.style.left=divLeft+MoveWidth+"px";
    
 }
 oTimer=null;
 oTimer=setInterval(function(){imagemove("floatdiv");},10);


</script>

xiongxyt2

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS广告

横向左右来回移动hello 尊敬的客户：您好！为了给客户提供更优质的服务，网络运营商于2012年1月1日中午12：00-18：00进行网络维护，届时我司的xx服务系统网页将会打不开。给您带来不便，敬请谅解。 xxx科技有限公司 2011-12-30 func
复制链接

扫一扫