jQuery的隨機旋轉

我有一些圖片（20）的一個div，我喜歡上一些讓小小的旋轉說+ -2dgjQuery的隨機旋轉

我有嘗試，但沒有成功......所有的圖像都同等地旋轉

/* By default, we tilt all our images -2 degrees */ 
#gallery2 img { 
    -webkit-transform: rotate(-2deg); 
    -moz-transform: rotate(-2deg); 
    } 

/* Rotate all even images 2 degrees */ 
#gallery2 img:nth-child(even) { 
    -webkit-transform: rotate(2deg); 
    -moz-transform: rotate(2deg); 
    } 

/* Don't rotate every third image, but offset its position */ 
#gallery2 img:nth-child(3n) { 
    -webkit-transform: none; 
    -moz-transform: none; 
    } 

/* Rotate every fifth image by 5 degrees and offset it */ 
#gallery2 img:nth-child(5n) { 
    -webkit-transform: rotate(5deg); 
    -moz-transform: rotate(5deg); 
    }

所以我喜歡有jQuery的代碼，將通過在div的所有圖像，並將其+甌隨機旋轉 - 2 DG

有人知道熱做到這一點？

來源

2010-10-01 menardmam

請問CSS不正確旋轉圖像？如果是這樣，那麼你不需要發佈樣式，而是你的JavaScript遇到麻煩。 – rfunduk 2010-10-01 19:34:02

$("#gallery2 img").each(function() { 
    var rNum = (Math.random()*4)-2; 
    $(this).css({ 
    '-webkit-transform': 'rotate('+rNum+'2deg)', 
    '-moz-transform': 'rotate('+rNum+'2deg)' 
    }); 
});

來源

2010-10-01 19:33:22 FatherStorm

-1

我有嘗試的..很好地工作，但你的代碼是更好的和更短的

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#gallery2 img").each(function() { 
    var posneg = Math.floor((Math.random() * 2) ); 
    if (posneg == 0) {posneg=-1} else {posneg=1}; 
    var angle = Math.floor((Math.random() * 5) * posneg); 
    $(this).css('transform', 'rotate(' + angle + 'deg)'); 
    $(this).css('-moz-transform', 'rotate(' + angle + 'deg)'); 
    $(this).css('-webkit-transform', 'rotate(' + angle + 'deg)'); 
    $(this).css('-o-transform', 'rotate(' + angle + 'deg)'); 
    alert(angle); 

    }); 
    }); 
</script>

來源

2010-10-01 19:51:52 menardmam

jQuery的隨機旋轉

回答

相關問題