学习用JavaScript画一个笑脸
<mce:script type="text/javascript" src="../jquery-1.2.3-intellisense.js" mce_src="jquery-1.2.3-intellisense.js"></mce:script>
<mce:script type="text/javascript"><!--
$(function() {
dayuan(200, 500, 200, 270, -90);
setTimeout(" dayuan(50, 420, 150, 180, 0);", 5000);
setTimeout(" dayuan(50, 590, 150, 180, 0);", 9000);
setTimeout(" dayuan(50, 500, 250, 0, -180);", 13000);
}
)
function dayuan(r,x,y,a,c) { //r 圆半径,x 圆心的横坐标,a 起始角度,y 圆心纵坐标,c 终点坐标
var div = document.getElementById("div1");
var xs = setInterval(function test() {
var b = (Math.PI * (a)) / 180; //角度换成弧度
a = a - 1; //每一次按一度递减
div.style.top = eval(y - r * Math.sin(b)) + "px"; //设置新的坐标
div.style.left = eval(x + r * Math.cos(b)) + "px";
var off = $("#div1").offset(); //获取新的坐标
$("body").append("<div id='div" + off.left + off.top + "' class=\"te\"></div>"); //添加圆的每一个点
var divx = document.getElementById("div" + off.left + off.top);
divx.style.left = off.left+"px"; //设置圆的每一个点的坐标
divx.style.top = off.top+"px";
// alert($("#div" + off.left + off.top).offset().left+" "+off.left);
if (a == c) {
clearInterval(xs);
}
}, 10);
}
// --></mce:script>
#div1
{
width:5px;
height:5px;
background-color:Black;
position:absolute;
top:100px;
left:50px;
overflow:hidden;
}
.te
{
position:absolute;
width:5px;
height:5px;
background-color:#ff0000;
overflow:hidden;
}
html代码
<div id="div1"></div>
相关文档:
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetL ......
Optimizing JavaScript code
Authors: Gregory Baker, Software Engineer on GMail & Erik Arvidsson, Software Engineer on Google Chrome
Recommended experience: Working knowledge of JavaScript
Client-side
scripting can make your application dynamic and active, but the
browser's interpretation o ......
1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)> <td>no </table> 可用于Table
2. <body onselectstart="return false"> 取消选取、防止复制
3. onpaste="return false" 不准粘贴
4. oncopy="return false;" oncut="re ......
Although the days of long and tedious code branches to target specific browsers in JavaScript are over, once in a while it's still necessary to do some simple code branching and object detection to ensure that a certain piece of code is working properly on a user's machine.
In this article, I ......