jquery 层根据矩形路径移动和闪耀(原创)
<html>
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script>
$(function(){
var oLeft=parseInt(/\d+/.exec($("div").css("left"))[0]);
var oTop=parseInt(/\d+/.exec($("div").css("top"))[0]);
$("div").animate({opacity:'toggle'}, 500);
},500);
setInterval(function(){
runDemo($("div"),oLeft,oTop,300,200);
},20);
});
function runDemo(moveDiv,oLeft,oTop,bWidth,bHeight){
if((/\d+/.exec(moveDiv.css("left"))<width&&/\d+/.exec(moveDiv.css("left"))>=oLeft) && /\d+/.exec(moveDiv.css("top"))==oTop){
moveDiv.css({"left":"+=1"+"px"});
}else if(/\d+/.exec(moveDiv.css("left"))==width&&(/\d+/.exec(moveDiv.css("top"))>=oTop&&/\d+/.exec(moveDiv.css("top"))<height)){
moveDiv.css({"top":"+=1"+"px"});
}else if((/\d+/.exec(moveDiv.css("left"))<=width&&/\d+/.exec(moveDiv.css("left"))>oLeft)&&/\d+/.exec(moveDiv.css("top"))==height){
moveDiv.css({"left":"-=1"+"px"});
}else if(/\d+/.exec(moveDiv.css("left"))==oLeft&&(/\d+/.exec(moveDiv.css("top"))<=height&&/\d+/.exec(moveDiv.css("top"))>=oTop)){
moveDiv.css({"top":"-=1"+"px"});
}
}
</script>
<body>
<div style='width:50px;height:25px;position:absolute;top:10px;left:10px;'>hello</div>
</body>
</html>
最新文章
- Unity3D中Update()与FixedUpdate()的区别
- [Java 基础] 使用java.util.zip包压缩和解压缩文件
- android最佳实践之设备兼容性
- 百胜集团李磊:BPM实现业务流程全过程无缝链接
- ELK kibana查询与过滤(17th)
- explicit构造函数的作用
- js中关于arguments
- java\C#\php主流语言实现FMS流媒体传输协议RTMP的开源组件
- Visual Studio 2008中FormatX源代码格式化插件
- ubuntu忘记密码,无法sudo的解决方法
- 个人作业2 英语学习APP分析
- vim 自动在操作符 前后加上空格 C语言
- Linux中ctrl+z 、ctrl+c、 ctrl+d区别
- ●POJ 2284 That Nice Euler Circuit
- IIC为什么要配置为开漏输出呢?
- Elasticsearch 备忘
- windows上面链接使用linux上面的docker daemon
- easyui再学习的一部分代码
- 阿里云linux图形界面(centos6)
- [AngularJS] tips技巧收集