<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
<script src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>
<style type="text/css">
  .circle{
  width:280px;
  height:180px;
  background:radial-gradient(closest-side,red 1%,yellow 10%,#00ffff 50%);
  border-radius:50%;
  position:absolute;
  top:200px; 
} 
</style>
</head>
<body>
<div id="circle" class="circle" onmouseover="b()" onmouseout="d()"></div>
<input type="button" value="start" onclick="ae()"/>
<div id="seconds" class="second"></div>
<script type="text/javascript">
var e
function b(){$(".circle").animate({width:"-=10px", height:"+=10px",top:"-=15px",right:"-=15",opacity:"1"},3000);            
           }
function ae(){e=setInterval(b,1000)}
var w=$(".circle").width()
var h=$(".circle").height()
if(r==l){clearInterval(e)}
</script>
</body>
</html>

jquery循环动画的更多相关文章

  1. 精选7款绚丽的HTML5和jQuery图片动画特效

    在HTML5出现后,图片就变得更加富有动感了,各种图片动画特效也层出不穷,例如图片播放器.图片导航.3D图片动画等等.本文将精选几款具有代表性的HTML5和jQuery图片动画特效,绚丽的画面.实用的 ...

  2. 第73天：jQuery基本动画总结

    一.DOM对象跟jQuery对象相互转换 jQuery对象转换成DOM对象: 方式一:$(“#btn”)[0] 方式二:$(“#btn”).get(0) DOM对象转换成jQuery对象: $(doc ...

  3. jquery animate 动画效果使用解析

    animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jq ...

  4. jQuery的动画处理总结

    最近一年多一直在做前端的东西,由于老板在追求一些年轻动感的效果,让页面元素不能仅仅是简单的隐藏显示,所以经常会使用一些动画效果,发现jQuery的动画真心好用啊,把常用的几个总结一下,希望不再每次使用 ...

  5. jQuery实现动画过程中尽量避免出现网页滚动条

    jQuery实现动画过程中尽量避免出现网页滚动条,不然可能会出现动画效果异常.

  6. jQuery Easing动画效果扩展（转）

    jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...

  7. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  8. 写多个物件css3循环动画案例原理

    div { background-color: #67CF22; height: 100%; width: 6px; display: inline-block; -webkit-animation: ...

  9. 多行滚动jQuery循环新闻列表代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. PHPcms v9.6.0 文件上传漏洞

    title: PHPcms v9.6.0 文件上传漏洞 date: 2021-4-5 tags: 渗透测试,CVE漏洞复现,文件上传 categories: 渗透测试 CVE漏洞复现 文件上传 PHP ...

  2. margin (子元素远离父元素边框)

    如果父盒子没有设置border框着,那么他的子元素无法利用margin-top 来远离父元素的上边框 如果使用了margin-top会使子元素和父元素一起往下移 (子想离,父不设置border边框 则 ...

  3. 风变编程（Python自学笔记）第11关-杀死那只“机”生虫

    1.Debug:为程序排除错误. 2.SyntaxError:语法错误. 3.append()函数是列表的一个方法,要用句点.调用,且append()每次只能接受一个参数. 4.解决思路不清的两个工具 ...

  4. ASP.NET Core文件压缩最佳实践

    前言 在微软官方文档中,未明确指出文件压缩功能的使用误区. 本文将对 ASP.NET Core 文件响应压缩的常见使用误区做出说明. 误区1:未使用 Brotil 压缩 几乎不需要任何额外的代价,Br ...

  5. traefik ingress Controller使用

    Kubernetes Ingress Kubernetes Ingress是路由规则的集合,这些规则控制外部用户如何访问Kubernetes集群中运行的服务. 在Kubernetes中,有三种方式可以 ...

  6. cnetos 网卡绑定 eth0+eth1做双网卡绑定到bond0

    1.网卡绑定:eth0+eth1做双网卡绑定到bond0 二.网络配置 网卡绑定1./etc/sysconfig/network-scripts/目录下建立ifcfg-bond0文件,内容如下DEVI ...

  7. 抓住异步编程async/await语法糖的牛鼻子: SynchronizationContext

    长话短说,本文带大家抓住异步编程async/await语法糖的牛鼻子: SynchronizationContext 引言 C#异步编程语法糖async/await,使开发者很容易就能编写异步代码. ...

  8. ssh登录巨慢加速验证

    ssh登录巨慢怎么办,设计验证是好的,但是那些验证的确没啥用反而造成了一些不便修改/开启 /etc/ssh/ssh_config这三个参数再重启即可取消验证 StrictHostKeyChecking ...

  9. 用navigation的大致图

  10. 字符串算法(string_algorithm)

    format 作用 格式化输出对象,可以不改变流输出状态实现类似于printf()的输出 头文件 #include <boost/format.hpp> using namespace b ...