Question

好的，我几乎查看了这个网站上的所有轮换条目，但无法解决这个问题。已经整整3天试图解决这个问题。这很可能是非常简单但我无法得到它。这是问题：我有2个图像有旋转控件。但是，当我旋转1时，它们都会旋转。我希望他们不要同时旋转，而是自己旋转。你可以在这里看到它：http://dl.dropbox.com/u/11770605/sample2.html

以下是main.js的代码：

    $(document).ready(function(){ $('.cc-element').rotatable(); });

这是标记：

    <span id="cc-element-1" class="cc-element ui-draggable cc-active" style="-webkit-transform: rotate(0deg);" ><image goes here></span>

我也试过了：

    $(document).ready(function(){
    $('.cc-element').rotatable();
    $('.cc-element2').rotatable();
    });

和

    <span id="cc-element-2" class="cc-element ui-draggable cc-active" style="-webkit-transform: rotate(0deg);" > <image goes here>< /span>

但是这种修改不起作用。请帮助我，我必须尽快解决这个问题。

Answer 1

问题是你的“rotate（）”插件会对传递给它的this值进行操作，当你的选择器为“.cc-element”时，它将是列表两个元素。因此，您对“roll（）”插件的调用将在整个列表中运行。

您需要在“each（）”迭代器中将该插件中的相应代码包装起来。类似的东西：

    $.fn.rotatable = function() {
      return this.each(function() {
        var $this = $(this),
          // ... the rest of the plugin, as it is now ...
      });
    };

Answer 2

您按类选择元素，它们都具有相同的类。改变它：

$(document).ready(function(){
    $('#cc-element').rotatable();
    $('#cc-element2').rotatable();
    });

-webkit-transform旋转问题

2 个答案: