コードをコピー コードは次のとおりです: <頭> スパイラル <br>var スパイラル; <br>var yjq; <br>(function(){ <br> yjq = function(name,turns,duration,frame,count,decrease_time){ <br> $('style.enable_remove').remove(); <br> $(' [id^=test]').css({'position':'absolute','width':10,'height':10,'top':300,'left':300,'background':'black '}); <br> スパイラル(名前 '1',600,300,300,300,ターン,期間,フレーム); <br> スパイラル(名前 '2',300,0,300,300,ターン,期間,フレーム); <br> '3',0,300,300,300,turns,duration,frame); <br> スパイラル(name '4',300,600,300,300,turns,duration,frame); <br> $('#' name '1').css({" -webkit-animation":name "1 " 継続時間 "ms リニア " count}); <br> $('#' name '2').css({"-webkit-animation":name "2 " 継続時間 "ms Linear " count}); <br> $('#' name '3').css({"-webkit-animation":name "3 " period "ms Linear " count}); <br> $('# ' name '4').css({"-webkit-animation":name "4 " period "ms Linear " count}); <br> var arg = 引数; <br> $("#" name "4" ).one('webkitAnimationEnd',function(){ <br> if(duration return; <br> } <br> arg.callee(name,turns,duration-=decrease_time,frame,count,decrease_time); <br> }); <br> } <br> Spiral = function(name,w1,h1,w2,h2,N,T,frame){ <br> var interval = T/frame;//每帧间間隔 <br> var n;/ /圈数 <br> var i = 0; <br> var k;//初期象限 <br> var R = Math.sqrt(Math.pow(w2-w1,2) Math.pow(h2-h1,2),2);// 半径 <br> var style="@-webkit-keyframes " name "{"; <br> var styleDom=$("<style class='enable_remove'></style>"); <br> if(w1>w2 && h1 k = 1; <br> }else if(w1 k = 2; <br> }else if(w1<w2 h1>=h2){ <br> k = 3; <br> }else { <br> k = 4; <br> } <br> for(var t=0;t<t> var t1 = t%(T/N); <br> n = Math.floor(t/(T/N)); <br> x = h2-R*(1-t1/T-n/N)*Math.cos(2*Math.PI*t1*N/T Math.pow(-1,k)*Math.atan(Math. abs(w2-w1)/Math.abs(h2-h1)) (k>2?1:0)*(k%2?-1:1)*Math.PI); <br> y = w2-R*(1-t1/T-n/N)*Math.sin(2*Math.PI*t1*N/T Math.pow(-1,k)*Math.atan(Math. abs(w2-w1)/Math.abs(h2-h1)) (k>2?1:0)*(k%2?-1:1)*Math.PI); <br> style =(i )*100/フレーム '%{top:' x 'px;left:' y 'px;}'; ").append(styleDom); <br> }; <br>})(); <br>$(function(){ <br> var name = 'test'; <br> var Turn = 5; // 回転数 <br> varduration = 2000;// サブアニメーションの消費時間 <br> var減少_time = 100;// 各サブアニメーションの時間の短縮量 <br> var Frame = 1000; //サブアニメーションのフレーム数 <br> var count = 2;//サブアニメーションの実行数 <br> yjq(name,turns,duration,frame,count,decrease_time) <br>}; > "test3">