Div使用Javascript在循环旋转中移动

时间:2009-05-09 05:53:46

标签: javascript html css dhtml

是否可以使用javascript在循环旋转中旋转Div。我在HTML页面中有四个DIV。我需要循环旋转这些DIV。

如果有可能现在告诉我。这很紧急。

4 个答案:

答案 0 :(得分:4)

实际上并不难:

function moveDiv(t,mdiv) {
            t = t + 0.05; // "time"
            var r = 10, //radius of circle
                xcenter = 400, //x location of circles centre on screen
                ycenter = 400, //y location of circles centre on screen
                x = Math.floor(xcenter + (r * Math.cos(t))), //circles parametric function
                y = Math.floor(ycenter + (r * Math.sin(t))); //circles parametric function
            mDiv.style.top = x + "px"; //set divs new coordinates
            mDiv.style.left = y + "px"; //set divs new coordinates

            setTimeout(function() { //make sure the animation keeps going
                moveDiv(t,mdiv);
            }, 100);
}
    myDiv = //get div element
    moveDiv(1,myDiv); //start the animation

尚未测试,但这是关于它应该如何工作。确保将这些div的css“position”属性设置为绝对或固定。另请查看parametric equation圈子。

答案 1 :(得分:1)

您可以使用Raphaël JavaScript库来完成此类操作。

史蒂夫

答案 2 :(得分:1)

我不确定我是否理解这个问题,但请看一下'Cycle'jQuery插件:http://www.malsup.com/jquery/cycle/

答案 3 :(得分:0)

这可能会完成......但不容易,你将无法保持div内容的原始感觉。

除非我误解了你的问题,如果你只是谈论骑自行车通过4个div ...这是绝对可能的,也很容易。但是如果你问你是否可以旋转实际的div ...