<!DOCTYPE html>
<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]);

setInterval(function(){
$("div").animate({opacity:'toggle'}, 500);
},500);

setInterval(function(){

runDemo($("div"),oLeft,oTop,300,200);

},20);

});
function runDemo(moveDiv,oLeft,oTop,bWidth,bHeight){

var width=bWidth+parseInt(oLeft),height=bHeight+parseInt(oTop);

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>

</head>
<body>
<div style='width:50px;height:25px;position:absolute;top:10px;left:10px;'>hello</div>
</body>
</html>
算法有点复杂，求大神简化

jquery 层根据矩形路径移动和闪耀（原创）的更多相关文章

  1. jquery层居中,点击小图查看大图,弹出层居中代码，顶部层固定不动，滚动条滚动情况

    jquery层居中,点击小图查看大图,弹出层居中代码 http://www.cnblogs.com/simpledev/p/3566280.html 见第一版,发现一个情况,如果页面内容多出一屏的情况 ...

  2. linux2.6.24内核源代码分析（2）——扒一扒网络数据包在链路层的流向路径之一

    在2.6.24内核中链路层接收网络数据包出现了两种方法,第一种是传统方法,利用中断来接收网络数据包,适用于低速设备:第二种是New Api(简称NAPI)方法,利用了中断+轮询的方法来接收网络数据包, ...

  3. MVC中JQuery文件引入的路径问题，@Url.Content函数

    今天写了个MVC的Demo,文件夹结构很简单,如下: 利用EF生成Model框架并手工加表字段注解,但在页面上JS验证始终没显示.实在无语. 无意中在浏览器里按F12,看见提示:   Failed t ...

  4. [Django] html 前端页面jQuery、图片等路径加载问题

    严格的说这个话题应该属于一个html前端路径加载问题.为了实现一个局部更新页面的功能,简单了解了一下Ajax.Ajax是一个为了实现浏览器和服务器异步通信功能的模块.严格来说不是一个新的语言,只是JS ...

  5. jsp jquery js 的基本路径获取

    引子:js中需要当前页面的基础路径,获取不到request,可以通过如下方法来解决!   1.jsp基础路径,在jsp头部加上,获取基础路径http://localhost:8080/project/ ...

  6. jquery层居中,点击小图查看大图,弹出层居中代码

    1.层居中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  7. jquery动态设置图片路径和超链接href属性

    js document.getElementById("myImage").src="hackanm.gif"; jquery $("#img&quo ...

  8. jquery 直接访问图片路径

    jQuery("#img").attr("src",function(){return this.src+"?"});

  9. tomcat对请求路径的匹配过程(原创)

    1.匹配服务 如果有两个应用,一个应用只能通过80端口访问,另一个应用只能通过8080端口访问,这种情况下,可以分开两个服务,然后分别创建80端口和8080端口的连接器. 2.匹配主机 一个服务下配置 ...

随机推荐

  1. linux文件系统，文件的分类

    从硬盘的构造可知,每次对物理磁盘的访问的最小单位是一个盘面上的一个磁道的扇区,即使用户需要读取一个字节的数据,实际读写时都是先把该字节所在的扇区读读入到内存,然后再访问. 1.普通文件 2.目录文件 ...

  2. CSUOJ_1000

    /* * Title : A+B(I) * Data : 2016/11/09 * Author : Andrew */ #include <iostream> int main() { ...

  3. window 配置wnmp(转下整理 ，全)

    工具/原料   RunHiddenConsole.exe 下载地址:http://pan.baidu.com/share/link?shareid=100074&uk=822373947 方法 ...

  4. an interview question(1)

    声明:本文为博主原创文章,未经博主允许不得转载. 以下是英文翻译: warnning: Copyright!you can't reprint this blog when you not get b ...

  5. 为什么不要使用Response.Close()

    不要使用Response.Close()    不要使用Response.Close()    不要使用Response.Close()        1  因为:Close()方法会调用HttpWo ...

  6. JS获取Url中传入的参数

    一:后台获取,前台调用 后台: object value= Request.QueryString[key]; 前台js: $(function(){ var value="<%=va ...

  7. [地图SkyLine二次开发]框架(3)

    上节将显示我们地图的OBJECT控件,布了一下局,但地图没有进行加载. 这是因为我们要在另一个页面,对OBJECT控件进行地图加载,并且得到该控件的sgworld,以便对其进行我们想要的开发. 这里, ...

  8. c++ is_space函数

    C库函数int isspace(int c)检查传递的字符是否是空白. 标准空白字符: ' ' (0x20) space (SPC) ' ' (0x09) horizontal tab (TAB) ' ...

  9. 初识Polymer框架

    什么是polymer? polymer由谷歌的Palm webOS团队打造,并在2013 Google I/O大会上推出,旨在实现Web Components,用最少的代码,解除框架间的限制的UI 框 ...

  10. IRLS(迭代加权最小二乘)

    IRLS用于解决这种目标函数的优化问题(实际上是用2范数来近似替代p范数,特殊的如1范数). 可将其等价变形为加权的线性最小二乘问题: 其中W(t)可看成对角矩阵,每步的w可用下面的序列代替 如果 p ...