jquery实现动态画圆_Javascript教程-查字典教程网
jquery实现动态画圆
jquery实现动态画圆
发布时间:2016-12-30 来源:查字典编辑
摘要:今天自己在写插件过程做中找到的一个不错的知识。自己做了一个小例子。复制代码代码如下:无标题文档$(document).ready(funct...

今天自己在写插件过程做中找到的一个不错的知识。自己做了一个小例子。

复制代码 代码如下:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<>

<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(e) {

var a = 200, b = 200, r = 90, times = 0;

setInterval(function flutter() {

times += 0.1;

var hudu = (2*Math.PI / 360) * 6 * times;

var X = a + Math.sin(hudu) * r;

var Y = b - Math.cos(hudu) * r // 注意此处是“-”号,因为我们要得到的Y是相对于(0,0)而言的。

//$(".sky_text").css({"left":X+"px","top":Y+"px"});

$("body").append('<div+X+'px; top:'+Y+'px; width:1px; height:1px; background:#00F;"></div>');

if(times == 60){

return;

}

}, 2);

});

</script>

<style type="text/css">

body,html{ padding:0; margin:0;}

</style>

</head>

<body>

<div></div>

</body>

</html>

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类