Changes:
* improved `selector` utility * improved/simplified `getPrefix()` utility * improve code readability for the core engine * improved demos
This commit is contained in:
thednp
parent
024fdd2322
commit
e0274126d8
|
|
@ -41,8 +41,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
2
api.html
2
api.html
|
|
@ -44,8 +44,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -10,33 +10,15 @@ body {
|
|||
font-size: 14px;
|
||||
line-height: 2; /* ~25px */
|
||||
color: #ccc;
|
||||
background-color: #999;
|
||||
background-color: #2e2e2e;
|
||||
position: relative
|
||||
|
||||
}
|
||||
|
||||
body > .fill {
|
||||
position: fixed; top: 0; left:0; right: 0; bottom:0;
|
||||
}
|
||||
|
||||
/* the body and it's children can be irresponsive on scroll animations as well */
|
||||
body[data-tweening="scroll"],
|
||||
body[data-tweening="scroll"] * { pointer-events: none !important; }
|
||||
|
||||
.fill {
|
||||
background-size: cover;
|
||||
background-position: 50% 50%;
|
||||
background-repeat: no-repeat;
|
||||
width: 100%; height: 100%;
|
||||
}
|
||||
.ie8 .fill {background-size: auto 100%}
|
||||
|
||||
.overlay {
|
||||
background-color: #000;
|
||||
opacity: 0.7
|
||||
}
|
||||
|
||||
.ie8 .overlay { filter: alpha(opacity=70) }
|
||||
|
||||
footer {
|
||||
clear: both; overflow: hidden; margin-top: 60px
|
||||
|
|
|
|||
|
|
@ -228,6 +228,10 @@
|
|||
var svgChained = document.getElementById('svgChained');
|
||||
var chainedBtn = document.getElementById('chainedBtn');
|
||||
var svgc = svgChained.getElementsByTagName('path')[0];
|
||||
var svgcTransform = svgc.getAttribute('transform');
|
||||
var resetSVGTransform = function(){
|
||||
svgc.setAttribute('transform',svgcTransform);
|
||||
};
|
||||
|
||||
var svgTween6 = KUTE.fromTo(svgc,
|
||||
{ // from
|
||||
|
|
@ -246,7 +250,7 @@
|
|||
// skewX: -45
|
||||
}
|
||||
},
|
||||
{transformOrigin: [256,256], yoyo: true, repeat: 1, duration: 1500, easing: "easingCubicOut"});
|
||||
{transformOrigin: [256,256], complete: resetSVGTransform, yoyo: true, repeat: 1, duration: 1500, easing: "easingCubicOut"});
|
||||
|
||||
chainedBtn.addEventListener('click', function(){
|
||||
!svgTween6.playing && svgTween6.start();
|
||||
|
|
|
|||
|
|
@ -44,8 +44,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
2
css.html
2
css.html
|
|
@ -43,8 +43,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -45,7 +45,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
|
|
|
|||
|
|
@ -42,8 +42,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
@ -307,13 +305,10 @@ body[data-tweening="scroll"] * { pointer-events: none !important; }
|
|||
|
||||
|
||||
<h3 id="crossbrowser">Cross Browser Animation Example</h3>
|
||||
<p>Unlike the examples <a href="http://codepen.io/thednp/pens/public/" target="_blank">hosted on Codepen</a>, most examples here should be supported on legacy browsers. The next example is going to explain more details about how to target browsers
|
||||
according to their supported properties, so stick around. So, if your target audience uses legacy browsers in a significant percent, check to have the proper polyfills and also make sure you target your browsers, here's a
|
||||
<a href="http://browserhacks.com/"
|
||||
target="_blank">complete reference</a>. Now we are ready:</li>
|
||||
</ul>
|
||||
<p>Unlike the examples <a href="http://codepen.io/thednp/pens/public/" target="_blank">hosted on Codepen</a>, most examples here should be supported on legacy browsers. The next example is going to explain more details about how to target browsers according to their supported properties, so stick around. So, if your target audience uses legacy browsers in a significant percent, check to have the proper polyfills and also make sure you target your browsers, here's a <a href="http://browserhacks.com/" target="_blank">complete reference</a>. Now we are ready:</p>
|
||||
|
||||
<h4>Collect Information And Cache It</h4>
|
||||
<pre><code class="language-javascript">// grab an HTML element to build a tween object for it
|
||||
<pre><code class="language-javascript">// grab an HTML element to build a tween object for it
|
||||
var element = document.getElementById("myElement");
|
||||
|
||||
// check for IE legacy browsers
|
||||
|
|
|
|||
|
|
@ -42,8 +42,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -39,8 +39,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -39,8 +39,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -44,8 +44,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
|
|
@ -41,8 +41,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
4
src/kute-attr.min.js
vendored
4
src/kute-attr.min.js
vendored
|
|
@ -1,2 +1,2 @@
|
|||
// KUTE.js v1.6.2 | © dnp_theme | Attributes Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("Attributes Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";var e,r="undefined"!=typeof global?global:window,n=t,i=n.dom,u=n.prepareStart,o=n.parseProperty,a=n.truC,s=n.truD,f=(n.crossCheck,r.Interpolate.unit,r.Interpolate.number),l=r.Interpolate.color,c=function(t,e){return t.getAttribute(e)},p=["fill","stroke","stop-color"],v=function(t){return t.replace(/[A-Z]/g,"-$&").toLowerCase()};return u.attr=function(t,e){var r={};for(var n in e){var i=v(n).replace(/_+[a-z]+/,""),u=c(this.element,i);r[i]=p.indexOf(i)!==-1?u||"rgba(0,0,0,0)":u||(/opacity/i.test(n)?1:0)}return r},o.attr=function(t,r){"attr"in i||(i.attr=function(t,e,r,n,u){for(var o in n)i.attributes[o](t,o,r[o],n[o],u)},e=i.attributes={});var n={};for(var u in r){var o=v(u),b=/(%|[a-z]+)$/,d=c(this.element,o.replace(/_+[a-z]+/,""));if(p.indexOf(o)===-1)if(null!==d&&b.test(d)){var y=s(d).u||s(r[u]).u,A=/%/.test(y)?"_percent":"_"+y;o+A in e||(/%/.test(y)?e[o+A]=function(t,e,r,n,i){var u=u||e.replace(A,"");t.setAttribute(u,(100*f(r.v,n.v,i)>>0)/100+n.u)}:e[o+A]=function(t,e,r,n,i){var u=u||e.replace(A,"");t.setAttribute(u,(f(r.v,n.v,i)>>0)+n.u)}),n[o+A]=s(r[u])}else b.test(r[u])&&null!==d&&(null===d||b.test(d))||(o in e||(/opacity/i.test(u)?e[o]=function(t,e,r,n,i){t.setAttribute(e,(100*f(r,n,i)>>0)/100)}:e[o]=function(t,e,r,n,i){t.setAttribute(e,(10*f(r,n,i)>>0)/10)}),n[o]=parseFloat(r[u]));else o in e||(e[o]=function(t,e,n,i,u){t.setAttribute(e,l(n,i,u,r.keepHex))}),n[o]=a(r[u])}return n},this});
|
||||
// KUTE.js v1.6.3 | © dnp_theme | Attributes Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["./kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("./kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("Attributes Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";var e,r="undefined"!=typeof global?global:window,n=t,i=n.dom,u=n.prepareStart,o=n.parseProperty,a=n.truC,s=n.truD,f=(n.crossCheck,r.Interpolate.unit,r.Interpolate.number),l=r.Interpolate.color,c=function(t,e){return t.getAttribute(e)},p=["fill","stroke","stop-color"],v=function(t){return t.replace(/[A-Z]/g,"-$&").toLowerCase()};return u.attr=function(t,e){var r={};for(var n in e){var i=v(n).replace(/_+[a-z]+/,""),u=c(this.element,i);r[i]=p.indexOf(i)!==-1?u||"rgba(0,0,0,0)":u||(/opacity/i.test(n)?1:0)}return r},o.attr=function(t,r){"attr"in i||(i.attr=function(t,e,r,n,u){for(var o in n)i.attributes[o](t,o,r[o],n[o],u)},e=i.attributes={});var n={};for(var u in r){var o=v(u),b=/(%|[a-z]+)$/,d=c(this.element,o.replace(/_+[a-z]+/,""));if(p.indexOf(o)===-1)if(null!==d&&b.test(d)){var y=s(d).u||s(r[u]).u,A=/%/.test(y)?"_percent":"_"+y;o+A in e||(/%/.test(y)?e[o+A]=function(t,e,r,n,i){var u=u||e.replace(A,"");t.setAttribute(u,(100*f(r.v,n.v,i)>>0)/100+n.u)}:e[o+A]=function(t,e,r,n,i){var u=u||e.replace(A,"");t.setAttribute(u,(f(r.v,n.v,i)>>0)+n.u)}),n[o+A]=s(r[u])}else b.test(r[u])&&null!==d&&(null===d||b.test(d))||(o in e||(/opacity/i.test(u)?e[o]=function(t,e,r,n,i){t.setAttribute(e,(100*f(r,n,i)>>0)/100)}:e[o]=function(t,e,r,n,i){t.setAttribute(e,(10*f(r,n,i)>>0)/10)}),n[o]=parseFloat(r[u]));else o in e||(e[o]=function(t,e,n,i,u){t.setAttribute(e,l(n,i,u,r.keepHex))}),n[o]=a(r[u])}return n},this});
|
||||
4
src/kute-css.min.js
vendored
4
src/kute-css.min.js
vendored
|
|
@ -1,2 +1,2 @@
|
|||
// KUTE.js v1.6.2 | © dnp_theme | CSS Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("CSS Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";for(var e="undefined"!=typeof global?global:window,r=t,n=r.dom,i=r.parseProperty,o=r.prepareStart,u=r.property,d=r.getCurrentStyle,a=r.truD,l=r.truC,f=e.Interpolate.number,c=(e.Interpolate.unit,e.Interpolate.color),g=["borderColor","borderTopColor","borderRightColor","borderBottomColor","borderLeftColor","outlineColor"],p=["right","bottom","minWidth","minHeight","maxWidth","maxHeight","padding","margin","paddingTop","paddingBottom","paddingLeft","paddingRight","marginTop","marginBottom","marginLeft","marginRight","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","outlineWidth"],s=["borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius"],h=["fontSize","lineHeight","letterSpacing","wordSpacing"],m=["clip"],b=["backgroundPosition"],v=p.concat(h),y=s.concat(p,h),R=g.concat(m,s,p,h,b),x=R.length,C=C||{},T=0;T<x;T++)g.indexOf(R[T])!==-1?C[R[T]]="rgba(0,0,0,0)":y.indexOf(R[T])!==-1?C[R[T]]=0:b.indexOf(R[T])!==-1?C[R[T]]=[50,50]:"clip"===R[T]&&(C[R[T]]=[0,0,0,0]);for(var T=0,W=g.length;T<W;T++)i[g[T]]=function(t,e){return t in n||(n[t]=function(t,e,r,n,i,o){t.style[e]=c(r,n,i,o.keepHex)}),l(e)},o[g[T]]=function(t){return d(this.element,t)||C[t]};for(var T=0,W=v.length;T<W;T++)i[v[T]]=function(t,e){return t in n||(p.indexOf(t)>-1?n[t]=function(t,e,r,n,i){t.style[e]=(i>.98||i<.02?(100*f(r.v,n.v,i)>>0)/100:f(r.v,n.v,i)>>0)+n.u}:n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r.v,n.v,i)>>0)/100+n.u}),a(e)},o[v[T]]=function(t,e){return d(this.element,t)||C[t]};for(var T=0,W=s.length;T<W;T++)i[s[T]]=function(t,e){return t in n||(n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r.v,n.v,i)>>0)/100+n.u}),a(e)},o[s[T]]=function(t,e){var r=t===s[0]?s[1]:t;return r=u(r),d(this.element,r)||C[t]};return i.clip=function(t,e){if(t in n||(n[t]=function(t,e,r,n,i){var o=0,u=[];for(o;o<4;o++){var d=r[o].v,a=n[o].v,l=n[o].u||"px";u[o]=(100*f(d,a,i)>>0)/100+l}t.style[e]="rect("+u+")"}),e instanceof Array)return[a(e[0]),a(e[1]),a(e[2]),a(e[3])];var r=e.replace(/rect|\(|\)/g,"");return r=/\,/g.test(r)?r.split(/\,/g):r.split(/\s/g),[a(r[0]),a(r[1]),a(r[2]),a(r[3])]},o.clip=function(t,e){var r=d(this.element,t),n=d(this.element,"width"),i=d(this.element,"height");return/rect/.test(r)?r:[0,n,i,0]},i.backgroundPosition=function(t,e){if(t in n||(n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r[0],n[0],i)>>0)/100+"% "+(100*f(r[1],n[1],i)>>0)/100+"%"}),e instanceof Array){var r=a(e[0]).v,i=a(e[1]).v;return[NaN!==r?r:50,NaN!==i?i:50]}var o=e.replace(/top|left/g,0).replace(/right|bottom/g,100).replace(/center|middle/g,50);return o=o.split(/(\,|\s)/g),o=2===o.length?o:[o[0],50],[a(o[0]).v,a(o[1]).v]},o.backgroundPosition=function(t,e){return d(this.element,t)||C[t]},this});
|
||||
// KUTE.js v1.6.3 | © dnp_theme | CSS Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["./kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("./kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("CSS Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";for(var e="undefined"!=typeof global?global:window,r=t,n=r.dom,i=r.parseProperty,o=r.prepareStart,u=r.property,d=r.getCurrentStyle,a=r.truD,l=r.truC,f=e.Interpolate.number,c=(e.Interpolate.unit,e.Interpolate.color),g=["borderColor","borderTopColor","borderRightColor","borderBottomColor","borderLeftColor","outlineColor"],p=["right","bottom","minWidth","minHeight","maxWidth","maxHeight","padding","margin","paddingTop","paddingBottom","paddingLeft","paddingRight","marginTop","marginBottom","marginLeft","marginRight","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","outlineWidth"],s=["borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius"],h=["fontSize","lineHeight","letterSpacing","wordSpacing"],m=["clip"],b=["backgroundPosition"],v=p.concat(h),y=s.concat(p,h),R=g.concat(m,s,p,h,b),x=R.length,C=C||{},T=0;T<x;T++)g.indexOf(R[T])!==-1?C[R[T]]="rgba(0,0,0,0)":y.indexOf(R[T])!==-1?C[R[T]]=0:b.indexOf(R[T])!==-1?C[R[T]]=[50,50]:"clip"===R[T]&&(C[R[T]]=[0,0,0,0]);for(var T=0,W=g.length;T<W;T++)i[g[T]]=function(t,e){return t in n||(n[t]=function(t,e,r,n,i,o){t.style[e]=c(r,n,i,o.keepHex)}),l(e)},o[g[T]]=function(t){return d(this.element,t)||C[t]};for(var T=0,W=v.length;T<W;T++)i[v[T]]=function(t,e){return t in n||(p.indexOf(t)>-1?n[t]=function(t,e,r,n,i){t.style[e]=(i>.98||i<.02?(100*f(r.v,n.v,i)>>0)/100:f(r.v,n.v,i)>>0)+n.u}:n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r.v,n.v,i)>>0)/100+n.u}),a(e)},o[v[T]]=function(t,e){return d(this.element,t)||C[t]};for(var T=0,W=s.length;T<W;T++)i[s[T]]=function(t,e){return t in n||(n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r.v,n.v,i)>>0)/100+n.u}),a(e)},o[s[T]]=function(t,e){var r=t===s[0]?s[1]:t;return r=u(r),d(this.element,r)||C[t]};return i.clip=function(t,e){if(t in n||(n[t]=function(t,e,r,n,i){var o=0,u=[];for(o;o<4;o++){var d=r[o].v,a=n[o].v,l=n[o].u||"px";u[o]=(100*f(d,a,i)>>0)/100+l}t.style[e]="rect("+u+")"}),e instanceof Array)return[a(e[0]),a(e[1]),a(e[2]),a(e[3])];var r=e.replace(/rect|\(|\)/g,"");return r=/\,/g.test(r)?r.split(/\,/g):r.split(/\s/g),[a(r[0]),a(r[1]),a(r[2]),a(r[3])]},o.clip=function(t,e){var r=d(this.element,t),n=d(this.element,"width"),i=d(this.element,"height");return/rect/.test(r)?r:[0,n,i,0]},i.backgroundPosition=function(t,e){if(t in n||(n[t]=function(t,e,r,n,i){t.style[e]=(100*f(r[0],n[0],i)>>0)/100+"% "+(100*f(r[1],n[1],i)>>0)/100+"%"}),e instanceof Array){var r=a(e[0]).v,i=a(e[1]).v;return[NaN!==r?r:50,NaN!==i?i:50]}var o=e.replace(/top|left/g,0).replace(/right|bottom/g,100).replace(/center|middle/g,50);return o=o.split(/(\,|\s)/g),o=2===o.length?o:[o[0],50],[a(o[0]).v,a(o[1]).v]},o.backgroundPosition=function(t,e){return d(this.element,t)||C[t]},this});
|
||||
2
src/kute-jquery.min.js
vendored
2
src/kute-jquery.min.js
vendored
|
|
@ -1,2 +1,2 @@
|
|||
// KUTE.js v1.6.2 | © dnp_theme | jQuery Plugin | MIT-License
|
||||
// KUTE.js v1.6.3 | © dnp_theme | jQuery Plugin | MIT-License
|
||||
!function(e,t){if("function"==typeof define&&define.amd)define(["./kute.js","jquery"],function(e,n){return t(n,e),e});else if("object"==typeof module&&"function"==typeof require){var n=require("./kute.js"),r=require("jquery");module.exports=t(r,n)}else{if("undefined"==typeof e.KUTE||"undefined"==typeof e.$&&"undefined"==typeof e.jQuery)throw new Error("jQuery Plugin for KUTE.js depend on KUTE.js and jQuery");var r=e.jQuery||e.$,n=e.KUTE;t(r,n)}}(this,function(e,t){"use strict";return e.fn.fromTo=function(e,n,r){var i=this.length>1?this:this[0],o=this.length>1?"allFromTo":"fromTo";return t[o](i,e,n,r)},e.fn.to=function(e,n){var r=this.length>1?this:this[0],i=this.length>1?"allTo":"to";return t[i](r,e,n)},this});
|
||||
4
src/kute-svg.min.js
vendored
4
src/kute-svg.min.js
vendored
File diff suppressed because one or more lines are too long
4
src/kute-text.min.js
vendored
4
src/kute-text.min.js
vendored
|
|
@ -1,2 +1,2 @@
|
|||
// KUTE.js v1.6.2 | © dnp_theme | Text Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("Text-Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";var e="undefined"!=typeof global?global:window,n=t,r=n.dom,i=n.prepareStart,s=n.parseProperty,u=e.Interpolate.number,o=n.defaultOptions,a=String("abcdefghijklmnopqrstuvwxyz").split(""),l=String("abcdefghijklmnopqrstuvwxyz".toUpperCase()).split(""),p=String("~!@#$%^&*()_+{}[];'<>,./?=-").split(""),f=String("0123456789").split(""),h=a.concat(l,f),c=(h.concat(p),Math.random),g=Math.min;return o.textChars="alpha",i.text=i.number=function(t,e){return this.element.innerHTML},s.text=function(t,e){return"text"in r||(r.text=function(t,e,n,r,i,s){var u=u||"alpha"===s.textChars?a:"upper"===s.textChars?l:"numeric"===s.textChars?f:"alphanumeric"===s.textChars?h:"symbols"===s.textChars?p:s.textChars?s.textChars.split(""):a,o=u.length,m=u[c()*o>>0],d="",x="",b=n.substring(0),y=r.substring(0);d=""!==n?b.substring(b.length,g(i*b.length,b.length)>>0):"",x=y.substring(0,g(i*y.length,y.length)>>0),t.innerHTML=i<1?x+m+d:r}),e},s.number=function(t,e,n){return"number"in r||(r.number=function(t,e,n,r,i){t.innerHTML=u(n,r,i)>>0}),parseInt(e)||0},this});
|
||||
// KUTE.js v1.6.3 | © dnp_theme | Text Plugin | MIT-License
|
||||
!function(t,e){if("function"==typeof define&&define.amd)define(["./kute.js"],e);else if("object"==typeof module&&"function"==typeof require)module.exports=e(require("./kute.js"));else{if("undefined"==typeof t.KUTE)throw new Error("Text-Plugin require KUTE.js.");e(t.KUTE)}}(this,function(t){"use strict";var e="undefined"!=typeof global?global:window,n=t,r=n.dom,i=n.prepareStart,s=n.parseProperty,u=e.Interpolate.number,o=n.defaultOptions,a=String("abcdefghijklmnopqrstuvwxyz").split(""),l=String("abcdefghijklmnopqrstuvwxyz".toUpperCase()).split(""),p=String("~!@#$%^&*()_+{}[];'<>,./?=-").split(""),f=String("0123456789").split(""),h=a.concat(l,f),c=(h.concat(p),Math.random),g=Math.min;return o.textChars="alpha",i.text=i.number=function(t,e){return this.element.innerHTML},s.text=function(t,e){return"text"in r||(r.text=function(t,e,n,r,i,s){var u=u||"alpha"===s.textChars?a:"upper"===s.textChars?l:"numeric"===s.textChars?f:"alphanumeric"===s.textChars?h:"symbols"===s.textChars?p:s.textChars?s.textChars.split(""):a,o=u.length,m=u[c()*o>>0],d="",x="",b=n.substring(0),y=r.substring(0);d=""!==n?b.substring(b.length,g(i*b.length,b.length)>>0):"",x=y.substring(0,g(i*y.length,y.length)>>0),t.innerHTML=i<1?x+m+d:r}),e},s.number=function(t,e,n){return"number"in r||(r.number=function(t,e,n,r,i){t.innerHTML=u(n,r,i)>>0}),parseInt(e)||0},this});
|
||||
4
src/kute.min.js
vendored
4
src/kute.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -44,8 +44,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
|
|||
4
svg.html
4
svg.html
|
|
@ -43,8 +43,6 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="fill overlay"></div>
|
||||
|
||||
<div class="site-wrapper">
|
||||
|
||||
<div class="navbar-wrapper">
|
||||
|
|
@ -513,7 +511,7 @@ KUTE.fromTo(element,
|
|||
{transformOrigin: [256,256]} // tween options use the transform-origin of the target SVG element
|
||||
).start();
|
||||
</code></pre>
|
||||
<p>Before you hit the <kbd>Start</kbd> button, make sure to check the <code>transform</code> attribute value.</p>
|
||||
<p>Before you hit the <kbd>Start</kbd> button, make sure to check the <code>transform</code> attribute value. The below tween will reset the element's transform attribute to original value when the animation is complete.</p>
|
||||
<div class="featurettes">
|
||||
<svg id="svgChained" class="example-box-model example-box" style="overflow: visible;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 513 513" xmlns:xml="http://www.w3.org/XML/1998/namespace" xml:space="preserve" version="1.1">
|
||||
<path class="bg-blue"
|
||||
|
|
|
|||
Loading…
Reference in a new issue