2008-02-22
超酷图片变换
<script>
var ticked=0;
var okayToGo = true;
var currentCreature = 1;
var forwardBackward = 1;
var theNewContainer = 1;
var theOldContainer = 2;
function toggleContainers()
{
theNewContainer = (theNewContainer == 1) ? 2 : 1;
theOldContainer = (theOldContainer == 1) ? 2 : 1;
}
function moveItem(thisCreature){
if(okayToGo&& thisCreature != currentCreature){
toggleContainers();
newCreature = thisCreature;
document.getElementById("y"+theNewContainer).style.zIndex = 50+10*forwardBackward;
document.getElementById("y"+theOldContainer).style.zIndex = 50+20*forwardBackward;
startTheMove = window.setInterval("rightOrLeft()",20);
}
}
function rightOrLeft()
{
if (ticked == 1020)
{
window.clearInterval(startTheMove);
ticked = 0;
forwardBackward = 1;
currentCreature = newCreature;
okayToGo = true;
}
else
{
okayToGo = false;
thisAngle = (Math.PI/2)*(ticked/1000);
document.getElementById("y"+theNewContainer).style.left = " "+(735-Math.sin(thisAngle)*700)+"px";
document.getElementById("y"+theNewContainer).style.top = " "+(105-(forwardBackward*Math.cos(thisAngle)*55))+"px";
document.getElementById("y"+theOldContainer).style.left = " "+(735-Math.sin(thisAngle+Math.PI/2)*700)+"px";
document.getElementById("y"+theOldContainer).style.top = " "+(105-(forwardBackward*Math.cos(thisAngle+Math.PI/2)*55))+"px";
ticked += 20;
}
}
</script>
<a href="javascript:moveItem(1);"><img src="http://t4.baidu.com/it/u=2900771931,2776220722&gp=6.jpg"></a>
<a href="javascript:moveItem(2);"><img src="http://t2.baidu.com/it/u=2879406521,1676348574&gp=44.jpg"></a>
<div align="right" style="position:absolute; right:5px; top:10px; height:435px; width:650px; overflow:hidden;background:#fff">
<div id="y1" style="position:absolute; left:35px; margin-top:20px; top:105px; z-index:90; width:100px;height:100px;background:#ffffff"><img src="http://www.sjjia.com/shoujitupian/downfileq/rhd/97908f1b2rhdqfn.jpg"></div>
<div id="y2" style="position:absolute; left:700px; margin-top:20px; top:105px; z-index:90; width:100px;height:100px;background:#ffffff"><img src="http://www.16277.com/caitu/uploadfile/2007/3/28/1057394275129.jpg"></div>
</div>
- 浏览: 34820 次
- 性别:

- 来自: 济南

- 详细资料
搜索本博客
最近加入圈子
最新评论
-
jquery起点教程
zfms 写道jquery其实比较简单的,如果js不错的话,学jquery应该没 ...
-- by isky -
大家谈谈用jquery的感受.. ...
楼主,真是Jquery强人。 我们建了一个jquery的圈子,希望楼主加入。 h ...
-- by chenzengpeng -
jQuery使用手册 三:CSS ...
$(#a).html()这样就能取到了,多看看api,很基础的东西
-- by zfms -
jQuery使用手册 三:CSS ...
我关心的是如何获取<div id="a" style="backgroun ...
-- by dmewy -
使用 jQuery 简化 Ajax 开 ...
这个帖子不错哦..
-- by dmewy






评论排行榜