Задать вопрос
@sabanovvv

Как уменьшить скорость анимации?

Использую анимированную иконку с сайта livicons.com/#iconlist,
а именно иконку wrench, вопрос в том,как замедлить скорость анимации?
test2.webjay.ru

код javascript
;jQuery(document).ready(function(){var dN="wrench",dS=32,dC="#34495e",dHC="#34495e",dCCOH=false,dET="hover",dA=true,dL=false,dOP=false,mD=200,hD=200,aC="activeicon",aPC="active",dAC="#000000",lDI=JSON.stringify({"wrench":{"d":1000,"it":1,"sh":[{"i":{"a":{"p":"M11.954,7.18l-1.928-2.298l-2.954,0.52L6.046,8.221l1.928,2.298l2.954-0.52L11.954,7.18zM7.851,8.665c-0.533-0.635-0.45-1.58,0.185-2.113c0.635-0.532,1.58-0.45,2.113,0.185c0.533,0.635,0.449,1.581-0.185,2.113C9.329,9.382,8.384,9.299,7.851,8.665z","o":0,"s":"none","fl":"#333"}},"f":{"9":{"o":0},"10":{"o":1},"15":{"t":"r-10,9,7.7"},"25":{"t":"r10,9,7.7"},"30":{"t":""},"31":{"o":0},"100":{}}},{"i":{"a":{"p":"M20.046,24.82l1.929,2.298l2.954-0.521l1.025-2.818l-1.928-2.298l-2.954,0.521L20.046,24.82zM24.149,23.336c0.532,0.635,0.45,1.58-0.185,2.113c-0.635,0.531-1.58,0.449-2.113-0.186s-0.449-1.58,0.185-2.113C22.671,22.618,23.616,22.701,24.149,23.336z","o":0,"s":"none","fl":"#333"}},"f":{"39":{"o":0},"40":{"o":1},"45":{"t":"r-10,23,24.3"},"55":{"t":"r10,23,24.3"},"60":{"t":""},"61":{"o":0},"100":{}}},{"i":{"a":{"p":"M15.03,13.384l-11.06,9.644c-1.178,1.027-1.3,2.816-0.277,3.997c1.024,1.181,2.809,1.307,3.986,0.279l11.071-9.655c2.496,1.198,5.571,0.882,7.793-1.056c2.107-1.836,2.877-4.636,2.238-7.177l-4.297,3.694L20.979,11.9l-0.708-3.651l4.308-3.703c-2.428-1.004-5.314-0.634-7.431,1.212C14.916,7.704,14.178,10.73,15.03,13.384z","t":"r0","s":"none","fl":"#333"}},"f":{"10":{"p":"M13.384,16.97l9.644,11.06c1.027,1.178,2.816,1.3,3.997,0.277c1.181-1.024,1.307-2.809,0.279-3.986L17.649,13.25c1.198-2.496,0.882-5.572-1.056-7.793c-1.836-2.107-4.636-2.877-7.177-2.239l3.694,4.297L11.9,11.022L8.249,11.73L4.545,7.422c-1.004,2.427-0.634,5.314,1.212,7.43C7.704,17.084,10.73,17.822,13.384,16.97z"},"15":{"t":"r-10,9,7.7"},"25":{"t":"r10,9,7.7"},"30":{"t":""},"40":{"p":"M18.615,15.03L8.972,3.971c-1.027-1.178-2.816-1.3-3.997-0.277C3.794,4.718,3.668,6.502,4.696,7.68l9.655,11.07c-1.198,2.496-0.882,5.572,1.056,7.793c1.835,2.107,4.635,2.877,7.176,2.239l-3.694-4.298l1.211-3.506l3.651-0.709l3.703,4.309c1.004-2.428,0.634-5.314-1.212-7.431C24.296,14.916,21.27,14.178,18.615,15.03z"},"45":{"t":"r-10,23,24.3"},"55":{"t":"r10,23,24.3"},"60":{"t":""},"70":{"p":"M15.03,13.384l-11.06,9.644c-1.178,1.027-1.3,2.816-0.277,3.997c1.024,1.181,2.809,1.307,3.986,0.279l11.071-9.655c2.496,1.198,5.571,0.882,7.793-1.056c2.107-1.836,2.877-4.636,2.238-7.177l-4.297,3.694L20.979,11.9l-0.708-3.651l4.308-3.703c-2.428-1.004-5.314-0.634-7.431,1.212C14.916,7.704,14.178,10.73,15.03,13.384z"},"100":{}}}]}}),lDI=lDI.replace(/\"d\":/g,'"duration":').replace(/\"i\":/g,'"init":').replace(/\"f\":/g,'"frames":').replace(/\"fIE\":/g,'"framesIE":').replace(/\"o\":/g,'"opacity":').replace(/\"t\":/g,'"transform":').replace(/\"it\":/g,'"iteration":').replace(/\"sh\":/g,'"shapes":').replace(/\"a\":/g,'"attr":').replace(/\"p\":/g,'"path":').replace(/\"fl\":/g,'"fill":').replace(/\"e\":/g,'"easing":').replace(/\"s\":/g,'"stroke-width":0,"stroke":'),liviconsdata=JSON.parse(lDI),sB=Raphael.svg,vB=Raphael.vml;
Raphael.fn.createLivicon=function(f,b,g,k,h,c,u,s,v,x,w,y,m){var e=[];g=clone(w);var d=g.shapes.length;s=s?s:g.iteration;var l=[],q=[],t=[],A="s"+y+","+y+",0,0";w=y=!1;if(b.match(/spinner/)){y=!0;var D=jQuery("#"+f),B=function(){if(D.is(":visible")){if(!z){for(var a=0;a< d;a++)e[a].animate(l[a].repeat(Infinity));z=!0}}else if(z){for(a=0;a< d;a++)e[a].stop();z=!1}}}b.match(/morph/)&&(w=!0);for(b=0;b< d;b++){var r=g.shapes[b].init,n;for(n in r)r[n].transform=A+r[n].transform}if(sB)for(b=0;b< d;b++)for(n in r=
g.shapes[b].frames,r)"transform"in r[n]&&(r[n].transform=A+r[n].transform);else for(b=0;b< d;b++)for(n in r=g.shapes[b].framesIE?g.shapes[b].framesIE:g.shapes[b].frames,r)"transform"in r[n]&&(r[n].transform=A+r[n].transform);for(b=0;b< d;b++)n=g.shapes[b].init.attr,"original"!=k&&(n.fill=k),t.push(n.fill),e[b]=this.path(n.path).attr(n);sB?jQuery("#"+f+" > svg").attr("id","canvas-for-"+f):jQuery("#"+f).children(":first-child").attr("id","canvas-for-"+f);f=jQuery("#"+f);m=m?m:f;if(!0==c){if(w){for(b=
0;b< d;b++)l.push(Raphael.animation(g.shapes[b].frames,mD)),q.push(g.shapes[b].init.attr);if(h){var C=clone(q);for(b=0;b< d;b++)C[b].fill=h}}else if(c=v?v:g.duration,!sB&&vB)for(b=0;b< d;b++)g.shapes[b].framesIE?l.push(Raphael.animation(g.shapes[b].framesIE,c)):l.push(Raphael.animation(g.shapes[b].frames,c)),q.push(g.shapes[b].init.attr);else for(b=0;b< d;b++)l.push(Raphael.animation(g.shapes[b].frames,c)),q.push(g.shapes[b].init.attr);if("click"==x)if(u&&!w)if(y){for(b=0;b<
d;b++)e[b].stop().animate(l[b].repeat(Infinity));var z=!0;setInterval(B,500)}else if(h){m.hover(function(){for(var a=0;a< d;a++)e[a].animate({fill:h},hD)},function(){for(var a=0;a< d;a++)e[a].animate({fill:t[a]},hD)});var p=!0;m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(p?l[a].repeat(u):q[a],0);p=!p})}else p=!0,m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(p?l[a].repeat(u):q[a],0);p=!p});else w?h?(m.hover(function(){for(var a=0;a< d;a++)e[a].animate({fill:h},
hD)},function(){for(var a=0;a< d;a++)e[a].animate({fill:t[a]},hD)}),p=!0,m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(p?l[a]:C[a],mD),p=!p})):(p=!0,m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(p?l[a]:q[a],mD),p=!p})):h?(m.hover(function(){for(var a=0;a< d;a++)e[a].animate({fill:h},hD)},function(){for(var a=0;a< d;a++)e[a].animate({fill:t[a]},hD)}),m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(l[a].repeat(s))})):
m.click(function(){for(var a=0;a< d;a++)e[a].stop().animate(l[a].repeat(s))});else if(u&&!w)if(y){for(x=0;x< d;x++)e[x].stop().animate(l[x].repeat(Infinity));z=!0;setInterval(B,500)}else h?m.hover(function(){for(var a=0;a< d;a++)e[a].stop().animate({fill:h},hD).animate(l[a].repeat(u))},function(){for(var a=0;a< d;a++)e[a].stop().animate(q[a],0)}):m.hover(function(){for(var a=0;a< d;a++)e[a].stop().animate(l[a].repeat(u))},function(){for(var a=0;a< d;a++)e[a].stop().animate(q[a],0)});else w?m.hover(function(){if(h)for(var a=
0;a< d;a++)e[a].stop().animate({fill:h},hD).animate(l[a]);else for(a=0;a< d;a++)e[a].stop().animate(l[a])},function(){for(var a=0;a< d;a++)e[a].stop().animate(q[a],mD)}):m.hover(function(){if(h)for(var a=0;a< d;a++)e[a].stop().animate(q[a],0).animate({fill:h},hD).animate(l[a].repeat(s));else for(a=0;a< d;a++)e[a].stop().animate(q[a],0).animate(l[a].repeat(s))},function(){for(var a=0;a< d;a++)e[a].animate({fill:t[a]},hD)})}else h&&m.hover(function(){for(var a=
0;a< d;a++)e[a].stop().animate({fill:h},hD)},function(){for(var a=0;a< d;a++)e[a].stop().animate({fill:t[a]},hD)});return!0};
(function(f){function b(){return b.counter++}b.counter=1;f.fn.extend({addLivicon:function(g){return this.each(function(){var k=f(this);if(!k.attr("id")){var h=b();k.attr("id","livicon-"+h)}var c=k.data();c.liviconRendered&&k.removeLivicon();c=fullNames(c);g&&(g=fullNames(g));var c=f.extend(c,g),h=k.attr("id"),u=k.parent(),s=c.name?c.name:dN,v=c.size?c.size:dS,x=c.eventtype?c.eventtype:dET,w=v/32;k[0].style.height?k.css("width",v):k.css({width:v,height:v});var y=s in liviconsdata?
liviconsdata[s]:liviconsdata[dN],m=k.hasClass(aC)||u.hasClass(aPC)?dAC:"original"==c.color?"original":c.color?c.color:dC,e=dA?!1==c.animate?c.animate:dA:!0==c.animate?c.animate:dA,d=dL?!1==c.loop?!1:Infinity:!0==c.loop?Infinity:!1,l=c.iteration?0< Math.round(c.iteration)?Math.round(c.iteration):!1:!1,q=c.duration?0< Math.round(c.duration)?Math.round(c.duration):!1:!1,t=dCCOH?dHC:!1;!1===c.hovercolor||
0===c.hovercolor?t=!1:!0===c.hovercolor||1===c.hovercolor?t=dHC:c.hovercolor&&(t=c.hovercolor);c=dOP?!1==c.onparent?!1:u:!0==c.onparent?u:!1;Raphael(h,v,v).createLivicon(h,s,v,m,t,e,d,l,q,x,y,w,c);k.data("liviconRendered",!0);return this})},removeLivicon:function(b){return this.each(function(){var k=f(this);k.data("liviconRendered",!1);if("total"===b)k.remove();else{var h=k.attr("id");f("#canvas-for-"+h).remove();return k}})},updateLivicon:function(b){return this.each(function(){var k=
f(this);k.removeLivicon().addLivicon(b);return k})}});f(".livicon").addLivicon()})(jQuery);function fullNames(f){f=JSON.stringify(f);f=f.replace(/\"n\":/g,'"name":').replace(/\"s\":/g,'"size":').replace(/\"c\":/g,'"color":').replace(/\"hc\":/g,'"hovercolor":').replace(/\"a\":/g,'"animate":').replace(/\"i\":/g,'"iteration":').replace(/\"d\":/g,'"duration":').replace(/\"l\":/g,'"loop":').replace(/\"et\":/g,'"eventtype":').replace(/\"op\":/g,'"onparent":');return f=JSON.parse(f)}
function clone(f){if(null==f||"object"!=typeof f)return f;var b=new f.constructor,g;for(g in f)b[g]=clone(f[g]);return b};});
  • Вопрос задан
  • 2695 просмотров
Подписаться 2 Оценить 3 комментария
Пригласить эксперта
Ответы на вопрос 3
yttrium
@yttrium
это точно весь код?
Ответ написан
У вас в html коде есть такая строчка
<span class="livicon" data-name="wrench" data-duration="600" id="livicon-1" style="width: 32px; height: 32px;">

Вот атрибут data-duration и есть продолжительность анимации в миллисекундах. Увеличьте до 2000 например.

И да, js код трогать не надо.
Ответ написан
Комментировать
iDennis
@iDennis
логично найти слово animate или setInterval и увеличить цифру
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы