如何圍繞徽標創建三個元素的軌道

Question

我是新手，我正在進行第一個項目：

我有三個元素（圖像）和一個標志。

當我點擊圖像時，這一個和另外兩個應該圍繞徽標在360°的軌道上移動（當它們在徽標背面時具有低z-index，因此它們可以消失然后重新出現）。

這有可能與jquery和css3？

Answer 1

Hiya 2演示從簡單開始：

1）（使用的div） http://jsfiddle.net/ErN8X/2/show ＆代碼： http://jsfiddle.net/ErN8X/2/

2） http://jsfiddle.net/qXP7H/show/和代碼： http ： //jsfiddle.net/qXP7H/

請看這里： jQuery插件使元素軌道成為另一個？

對於第二個演示，您可以復制粘貼來自jsfiddle的代碼。 休息這應該有所幫助，有一個好的，如果這有幫助，不要忘記接受答案。 :)

Jquery簡單演示

var angle = 0;     // starting position (degrees)
var distance = 30; // distance of b from a
var speed = 60;    // revolution speed in degrees per second
var rate  = 10;    // refresh rate in ms

function f() {

    var o = $('#a').offset();

    var t = o.top + (distance * Math.sin(angle * Math.PI/180.0));
    var l = o.left+ (distance * Math.cos(angle * Math.PI/180.0));

    $('#b').css({
        top: t,
        left: l
    });
    $('#c').css({
        top: t + 20,
        left: l + 30
    });
    $('#d').css({
        top: t +40,
        left: l +40
    });
    angle += (speed * (rate/1000)) % 360;
}

setInterval(f, rate);
​