291


jQueryっぽく要素を回転させたい

[code]

    $("#elem").rotate(90);　=> #elemが90度回転
    $("#elem").rotate() => "90"が返る
    
[/code]


CC BY-SA 3.0
2014-12-03T02:43:54.733
290
2014-12-27T15:31:17.783
2014-12-10T07:03:29.853
525
525
question
javascript html5 jquery
jQueryを拡張して要素を回転させたい


こんな感じになります。

[code]

    $.fn.rotate = function( deg ) {
      if( deg === undefined ) {
        deg = $(this[0]).data.rotateDeg;
        if ( deg === undefined ) { return 0; }
        else { return deg; }
      }
    
      this.each(function(){         
        var $el = $(this);
        var rotation = 'rotate('+ (deg) +'deg)';
        $el
          .css({ 
           'webkitTransform': rotation ,
           'mozTransform' : rotation ,
           'msTransform' : rotation ,
           'oTransform' : rotation ,
           'transform' : rotation });
          $el.data.rotateDeg = deg;
        });
        return this;
    };
    
[/code]


CC BY-SA 3.0
2014-12-03T02:43:54.733
291
2014-12-10T07:05:15.863
2014-12-10T07:05:15.863
525
525
290
answer


jQuery 1.8以降ならベンダプレフィックスは自動付加なのでこうでしょうか。

[code]

    (function($) {
      $.fn.rotate = function(angle) {
        if(angle == null) {
          return this.data("angle") || 0;
        } else {
          return this.data("angle", angle)
            .css("transform", "rotate(" + angle + "deg)");
        }
      };
    })(jQuery);
    
[/code]


CC BY-SA 3.0
2014-12-27T15:31:17.783
2705
2014-12-27T15:31:17.783
4388
290
answer