在網(wǎng)頁設(shè)計(jì)中，動(dòng)畫效果可以使頁面更加生動(dòng)有趣。在jQuery中，通過設(shè)置css屬性來實(shí)現(xiàn)動(dòng)畫效果。這篇文章將介紹如何使用jQuery設(shè)置圖片旋轉(zhuǎn)動(dòng)畫。

$(document).ready(function() { 
var degree = 0;
setInterval(function(){
degree = degree + 5;
$("#image").css({ transform: 'rotate(' + degree + 'deg)' }); 
},50);
});

首先，我們要在頁面中引入jQuery庫。在這個(gè)例子中，我們使用的是jQuery 3.6.0版本。

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

接下來，我們使用jQuery的css（）方法來設(shè)置旋轉(zhuǎn)動(dòng)畫。首先，在HTML中創(chuàng)建一個(gè)圖片元素。該元素的id設(shè)置為“image”：

然后，在jQuery中使用setInterval（）函數(shù)來不斷地旋轉(zhuǎn)圖片。在每個(gè)50毫秒的間隔中，將圖片旋轉(zhuǎn)五度，設(shè)置為變量degree的值。然后使用css（）方法來設(shè)置圖像的旋轉(zhuǎn)角度

$("#image").css({ transform: 'rotate(' + degree + 'deg)' });

在這個(gè)例子中，我們使用transform屬性來旋轉(zhuǎn)圖片。

在完成設(shè)置后，保存HTML和JavaScript文件。將它們打開并測(cè)試動(dòng)畫效果！