一款基于jQuery有趣的眼睛随鼠标进行有磁性的旋转

一款基于jQuery有趣的眼睛随鼠标进行有磁性的旋转,鼠标在何方,眼睛就往哪个方向转动,非常的的有趣的jQuery特效。适用浏览器:FireFox、Chrome、Safari、Opera、傲游、搜狗. 不支持IE8、360、世界之窗。

主要代码如下:

 1 <script>
 2     var getAngle = function(Xc, Yc, Xa, Ya, Xb, Yb) {
 3         var v1x = Xb - Xc;
 4         var v1y = Yb - Yc;
 5         var v2x = Xa - Xc;
 6         var v2y = Ya - Yc;
 7         return 180 * (Math.atan2(v1x, v1y) - Math.atan2(v2x, v2y)) / Math.PI
 8     };
 9     var left_center_offset = {
10         left: 30,
11         top: 82
12     },
13     right_center_offset = {
14         left: 96,
15         top: 80
16     },
17     radius = 10;
18     var setEyeOffset = function(event) {
19         var offset = $(".eye_wrapper").offset();
20         var x1 = offset.left + left_center_offset.left;
21         var y1 = offset.top + left_center_offset.top;
22         var x2 = offset.left + right_center_offset.left;
23         var y2 = offset.top + right_center_offset.top;
24         var n1 = event.clientX - x1;
25         var m1 = -(event.clientY - y1);
26         var k1 = Math.atan2(m1, n1);
27         var n2 = event.clientX - x2;
28         var m2 = -(event.clientY - y2);
29         var k2 = Math.atan2(m2, n2);
30         var x11 = (Math.cos(k1) * radius + x1).toFixed(0);
31         var y11 = (( - Math.sin(k1) * radius) + y1).toFixed(0);
32         $(".eye-left").offset({
33             left: x11,
34             top: y11
35         });
36         var x22 = (Math.cos(k2) * radius + x2).toFixed(0);
37         var y22 = (( - Math.sin(k2) * radius) + y2).toFixed(0);
38         $(".eye-right").offset({
39             left: x22,
40             top: y22
41         })
42     };
43     $(window).mousemove(setEyeOffset);
44 </script>

浏览的效果图如下:

 

特效来源地址:http://www.jqshare.com/Jq/fondone/id/89.html

更多特效请关注:jquery特效

posted @ 2013-05-13 16:09  不枉少年  阅读(513)  评论(0编辑  收藏  举报