特漂亮的JS图片排列旋转效果代码

更新时间：2007年12月28日 11:51:17 作者：

特漂亮的JS图片排列旋转效果代码

了下代码,感觉用数组模拟有些僵硬,自己重新写了一个,请大家来pp!

<style type="text/css"> body{background:black} .point{position:absolute;height:75px;border:1px silver solid} #round{position:absolute;background:red;width:200px;height:200px;} </style> <script>     var r=200,dv=0.01,w=100,x=400;y=100,pn=8     var pi=3.1415926575,d=pi/2;     var pd=Math.asin(w/2/r);ed=pi*2/pn;smove=true     function window.onload(){         var o=document.getElementById("imground");         var arrimg=o.getElementsByTagName("img");         for (n=0;n<arrimg.length;n++){             arrimg[n].onmouseout=function(){smove=true;}             arrimg[n].onmouseover=function(){smove=false;}             arrimg[n].onmousedown=function(){dv=dv*2}         }         setInterval(roundMove,20);     }     function roundMove(){         for (n=1;n<=8;n++){             var o=document.getElementById("p"+n)             var ta=Math.sin(d+ed*n);             var strFilter;             if (ta<0)    o.style.left=Math.cos(d+ed*n-pd)*r+x;             else o.style.left=Math.cos(d+ed*n+pd)*r+x;             o.style.top=ta*10+10+y;             o.style.width=Math.abs(Math.cos(d+ed*n+pd)-Math.cos(d+ed*n-pd))*r;             o.style.zIndex=ta*10;             if (o.style.zIndex<0) strFilter="FlipH(enabled:true)"             else strFilter="FlipH(enabled:false)";             if (ta<0) ta=(ta+1)*80+20; else ta=100;             strFilter=strFilter+" alpha(opacity="+ta+")";             o.style.opacity=ta/100;             o.style.filter=strFilter;         }         if (smove) d=d+dv;     } </script> <div id="imground"> <img class="point" id="p1" src="/upload/20071228115115772.jpg"/> <img class="point" id="p2" src="/upload/20071228115115527.jpg"/> <img class="point" id="p3" src="/upload/20071228115115831.jpg"/> <img class="point" id="p4" src="/upload/20071228115115794.jpg"/> <img class="point" id="p5" src="/upload/20071228115116920.jpg"/> <img class="point" id="p6" src="/upload/20071228115115772.jpg"/> <img class="point" id="p7" src="/upload/20071228115115527.jpg"/> <img class="point" id="p8" src="/upload/20071228115115831.jpg"/> </div>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

相关文章

符合web标准的连续滚动图像的js代码
符合web标准的连续滚动图像的js代码...
2007-02-02
图片上传之前检查大小、尺寸、格式并预览的js代码
就是在客户端判断上传图片的大小，尺寸，并生成预览图，用JavaScript实现的啊
2008-10-10
javascript 火狐(firefox)不显示本地图片问题解决
在Firefox一直不能用js做出图片预览的效果，下面这个即可解决，用替换的方法实现firefox支持得的路径格式
2008-07-07
javascript图片渐显效果代码
鼠标放上去图片明亮显示，不错的js效果
2008-05-05
js 图片缩放特效代码
非常不错nipic使用的图片缩放实现代码。
2009-05-05
JS实现鼠标移动到缩略图显示大图的图片放大效果
一个网页上用的图片提示效果，当把鼠标移动到图片缩略图的时候，会显示图片大图，似乎在网上这是个很常见的效果，实现方法也比较多，有人用CSS，有人用JavaScript，有人用jQuery，总之，选择自己习惯的方式去实现，就是最棒的。
2012-12-12
纯CSS实现的漂亮的立体图片边框效果，阴影代码
纯CSS 漂亮的立体图片边框效果，图片阴影代码，个人觉得这个挺实用，CSs实现的，定义成类，可让你整个网页上的图片都是有立体阴影的，不错吧，感谢作者分享。
2010-10-10
图片上传即时显示缩略图的js代码
主要用于上传图片的过程中可以显示图片，这样就可以确认图片有没有远错，利用提高正确率。
2009-05-05
javascript 随意拖动的小方块特效
可以拖动的小方块代码
2008-11-11
图片向上滚动
图片向上滚动...
2006-07-07

最新评论