]> _ Git - Animations.git/commitdiff
wait #2427 @0.4
authornael <nael@cubedesigners.com>
Thu, 20 Dec 2018 10:13:52 +0000 (11:13 +0100)
committernael <nael@cubedesigners.com>
Thu, 20 Dec 2018 10:13:52 +0000 (11:13 +0100)
AccordHotel-p60/p60-animleft/countUp.min.js [new file with mode: 0644]
AccordHotel-p60/p60-animleft/gotham-bold.woff [new file with mode: 0644]
AccordHotel-p60/p60-animleft/gotham-htf-medium.woff [new file with mode: 0644]
AccordHotel-p60/p60-animleft/gothamhtf-book.woff [new file with mode: 0644]
AccordHotel-p60/p60-animleft/index.html
AccordHotel-p60/p60-animleft/main.js
AccordHotel-p60/p60-animleft/style.css
AccordHotel-p60/p60-animleft/style.css.map
AccordHotel-p60/p60-animleft/style.sass

diff --git a/AccordHotel-p60/p60-animleft/countUp.min.js b/AccordHotel-p60/p60-animleft/countUp.min.js
new file mode 100644 (file)
index 0000000..c17c47b
--- /dev/null
@@ -0,0 +1 @@
+!function(a,n){"function"==typeof define&&define.amd?define(n):"object"==typeof exports?module.exports=n(require,exports,module):a.CountUp=n()}(this,function(a,n,t){return function(a,n,t,e,i,r){var u=this;if(u.version=function(){return"1.9.3"},u.options={useEasing:!0,useGrouping:!0,separator:",",decimal:".",easingFn:function(a,n,t,e){return t*(1-Math.pow(2,-10*a/e))*1024/1023+n},formattingFn:function(a){var n,t,e,i,r,o,s=a<0;if(a=Math.abs(a).toFixed(u.decimals),n=(a+="").split("."),t=n[0],e=1<n.length?u.options.decimal+n[1]:"",u.options.useGrouping){for(i="",r=0,o=t.length;r<o;++r)0!==r&&r%3==0&&(i=u.options.separator+i),i=t[o-r-1]+i;t=i}return u.options.numerals.length&&(t=t.replace(/[0-9]/g,function(a){return u.options.numerals[+a]}),e=e.replace(/[0-9]/g,function(a){return u.options.numerals[+a]})),(s?"-":"")+u.options.prefix+t+e+u.options.suffix},prefix:"",suffix:"",numerals:[]},r&&"object"==typeof r)for(var o in u.options)r.hasOwnProperty(o)&&null!==r[o]&&(u.options[o]=r[o]);""===u.options.separator?u.options.useGrouping=!1:u.options.separator=""+u.options.separator;for(var s=0,l=["webkit","moz","ms","o"],m=0;m<l.length&&!window.requestAnimationFrame;++m)window.requestAnimationFrame=window[l[m]+"RequestAnimationFrame"],window.cancelAnimationFrame=window[l[m]+"CancelAnimationFrame"]||window[l[m]+"CancelRequestAnimationFrame"];function d(a){return"number"==typeof a&&!isNaN(a)}window.requestAnimationFrame||(window.requestAnimationFrame=function(a,n){var t=(new Date).getTime(),e=Math.max(0,16-(t-s)),i=window.setTimeout(function(){a(t+e)},e);return s=t+e,i}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(a){clearTimeout(a)}),u.initialize=function(){return!!u.initialized||(u.error="",u.d="string"==typeof a?document.getElementById(a):a,u.d?(u.startVal=Number(n),u.endVal=Number(t),d(u.startVal)&&d(u.endVal)?(u.decimals=Math.max(0,e||0),u.dec=Math.pow(10,u.decimals),u.duration=1e3*Number(i)||2e3,u.countDown=u.startVal>u.endVal,u.frameVal=u.startVal,u.initialized=!0):(u.error="[CountUp] startVal ("+n+") or endVal ("+t+") is not a number",!1)):!(u.error="[CountUp] target is null or undefined"))},u.printValue=function(a){var n=u.options.formattingFn(a);"INPUT"===u.d.tagName?this.d.value=n:"text"===u.d.tagName||"tspan"===u.d.tagName?this.d.textContent=n:this.d.innerHTML=n},u.count=function(a){u.startTime||(u.startTime=a);var n=(u.timestamp=a)-u.startTime;u.remaining=u.duration-n,u.options.useEasing?u.countDown?u.frameVal=u.startVal-u.options.easingFn(n,0,u.startVal-u.endVal,u.duration):u.frameVal=u.options.easingFn(n,u.startVal,u.endVal-u.startVal,u.duration):u.countDown?u.frameVal=u.startVal-(u.startVal-u.endVal)*(n/u.duration):u.frameVal=u.startVal+(u.endVal-u.startVal)*(n/u.duration),u.countDown?u.frameVal=u.frameVal<u.endVal?u.endVal:u.frameVal:u.frameVal=u.frameVal>u.endVal?u.endVal:u.frameVal,u.frameVal=Math.round(u.frameVal*u.dec)/u.dec,u.printValue(u.frameVal),n<u.duration?u.rAF=requestAnimationFrame(u.count):u.callback&&u.callback()},u.start=function(a){u.initialize()&&(u.callback=a,u.rAF=requestAnimationFrame(u.count))},u.pauseResume=function(){u.paused?(u.paused=!1,delete u.startTime,u.duration=u.remaining,u.startVal=u.frameVal,requestAnimationFrame(u.count)):(u.paused=!0,cancelAnimationFrame(u.rAF))},u.reset=function(){u.paused=!1,delete u.startTime,u.initialized=!1,u.initialize()&&(cancelAnimationFrame(u.rAF),u.printValue(u.startVal))},u.update=function(a){u.initialize()&&(d(a=Number(a))?(u.error="",a!==u.frameVal&&(cancelAnimationFrame(u.rAF),u.paused=!1,delete u.startTime,u.startVal=u.frameVal,u.endVal=a,u.countDown=u.startVal>u.endVal,u.rAF=requestAnimationFrame(u.count))):u.error="[CountUp] update() - new endVal is not a number: "+a)},u.initialize()&&u.printValue(u.startVal)}});
\ No newline at end of file
diff --git a/AccordHotel-p60/p60-animleft/gotham-bold.woff b/AccordHotel-p60/p60-animleft/gotham-bold.woff
new file mode 100644 (file)
index 0000000..3ba9f64
Binary files /dev/null and b/AccordHotel-p60/p60-animleft/gotham-bold.woff differ
diff --git a/AccordHotel-p60/p60-animleft/gotham-htf-medium.woff b/AccordHotel-p60/p60-animleft/gotham-htf-medium.woff
new file mode 100644 (file)
index 0000000..213a928
Binary files /dev/null and b/AccordHotel-p60/p60-animleft/gotham-htf-medium.woff differ
diff --git a/AccordHotel-p60/p60-animleft/gothamhtf-book.woff b/AccordHotel-p60/p60-animleft/gothamhtf-book.woff
new file mode 100644 (file)
index 0000000..d028b51
Binary files /dev/null and b/AccordHotel-p60/p60-animleft/gothamhtf-book.woff differ
index 79dfc207fc8d4bf2fb32ad03f8c0bc684e710f67..e529cc763a8471cc9226bcf0c9a70096fe006f6d 100644 (file)
 <div class="container">
     <img class="img1" src="src/title.svg" alt="">
     <img class="img2" src="src/desc.svg" alt="">
-    <img class="img3" src="src/numbers.svg" alt="">
+    <!--<img class="img3" src="src/numbers.svg" alt="">-->
+
+    <div class="numbers">
+        <div class="line1"></div>
+        <div class="line2"></div>
+        <div class="line3"></div>
+
+        <span id="number1" class="number1">82</span>
+        <span id="number2" class="number2">20,775</span>
+        <span id="number3" class="number3">23</span>
+        <span id="number4" class="number4">18</span>
+        <span id="number5" class="number5">4,174</span>
+        <span id="number6" class="number6">51</span>
+        <span id="number7" class="number7">13,345</span>
+        <span id="number8" class="number8">13</span>
+        <span id="number9" class="number9">3,254</span>
+
+        <span class="txt1">hotels</span>
+        <span class="txt2">rooms</span>
+        <span class="txt3">countries</span>
+
+        <span class="continent1">EUROPE</span>
+        <span class="txt4">hotels</span>
+        <span class="txt5">rooms</span>
+
+        <span class="continent2">MIDDLE EAST<br>& AFRICA</span>
+        <span class="txt6">hotels</span>
+        <span class="txt7">rooms</span>
+
+        <span class="continent3">ASIA</span>
+        <span class="txt8">hotels</span>
+        <span class="txt9">rooms</span>
+    </div>
 </div>
 
 <script src="jQuery.js"></script>
 <script src="TweenMax.min.js"></script>
 <script src="TimelineMax.min.js"></script>
+<script src="countUp.min.js"></script>
 <script src="main.js"></script>
 </body>
 </html>
\ No newline at end of file
index 307c90af2f7586e73cad32ef3f46cb70e65aedc3..c7b97d0f77aadb1d743cadaddca68cb7e50957a5 100644 (file)
@@ -1,5 +1,75 @@
 let tl = new TimelineMax();
 
 tl.from('.img1',1.5,{display: 'none',x: -150,opacity:0});
-tl.from('.img2',1.5,{display: 'none',x: -150,opacity:0},"-=0.9");
-tl.from('.img3',1.5,{display: 'none',x: -150,opacity:0},"-=0.9");
+tl.from('.img2',1.5,{display: 'none',x: -150,opacity:0},"+=0.2");
+// tl.from('.img3',1.5,{display: 'none',x: -150,opacity:0},"-=0.9");
+
+tl.from('.numbers',1,{opacity:0},'+=5');
+
+var delay = 9.2;
+
+var id1 = document.getElementById("number1");
+var id2 = document.getElementById("number2");
+var id3 = document.getElementById("number3");
+var id6 = document.getElementById("number6");
+var id4 = document.getElementById("number4");
+var id5 = document.getElementById("number5");
+var id7 = document.getElementById("number7");
+var id8 = document.getElementById("number8");
+var id9 = document.getElementById("number9");
+
+var hidden = 0;
+var visible = 1;
+var dureeOpacite = delay * 1000;
+
+var options = {
+    useEasing: true,
+    useGrouping: true,
+    separator: ',',
+    decimal: '.',
+};
+var number1 = new CountUp('number1', 0, 82, 0, 2.5, options);
+var number2 = new CountUp('number2', 0, 20775, 0, 2.5, options);
+var number6 = new CountUp('number6', 0, 51, 0, 2.5, options);
+var number4 = new CountUp('number4', 0, 18, 0, 2.5, options);
+var number5 = new CountUp('number5', 0, 4174, 0, 2.5, options);
+var number3 = new CountUp('number3', 0, 23, 0, 2.5, options);
+var number7 = new CountUp('number7', 0, 13345, 0, 2.5, options);
+var number8 = new CountUp('number8', 0, 13, 0, 2.5, options);
+var number9 = new CountUp('number9', 0, 3254, 0, 2.5, options);
+if (delay > 0){
+    id1.style.opacity = hidden;
+    id2.style.opacity = hidden;
+    id6.style.opacity = hidden;
+    id4.style.opacity = hidden;
+    id5.style.opacity = hidden;
+    id3.style.opacity = hidden;
+    id7.style.opacity = hidden;
+    id8.style.opacity = hidden;
+    id9.style.opacity = hidden;
+    setTimeout(function () {
+        id1.style.opacity = visible;
+        id2.style.opacity = visible;
+        id6.style.opacity = visible;
+        id4.style.opacity = visible;
+        id5.style.opacity = visible;
+        id3.style.opacity = visible;
+        id7.style.opacity = visible;
+        id8.style.opacity = visible;
+        id9.style.opacity = visible;
+    },dureeOpacite );
+}
+function run() {
+    setTimeout(function () {
+        number1.start();
+        number2.start();
+        number6.start();
+        number4.start();
+        number5.start();
+        number3.start();
+        number7.start();
+        number8.start();
+        number9.start();
+    }, delay * 1000);
+}
+run();
index ccc0cd64aa6681188cf42380d8907cfdaa148adc..e739c173261f3b45ceb34e3ca691d1a34e2d41a0 100644 (file)
@@ -6,6 +6,15 @@
   display: none;
   position: absolute; }
 
+@font-face {
+  font-family: Gotham-Bold;
+  src: url("gotham-bold.woff"); }
+@font-face {
+  font-family: GothamHTF-Book;
+  src: url("gothamhtf-book.woff"); }
+@font-face {
+  font-family: GothamHTF-medium;
+  src: url("gotham-htf-medium.woff"); }
 .container {
   width: 402px;
   height: 750px; }
   top: 499px;
   left: 45px; }
 
+.numbers {
+  position: absolute;
+  top: 0; }
+
+.line1 {
+  width: 264px;
+  height: 1px;
+  background: #EA2349;
+  position: absolute;
+  top: 499px;
+  left: 45px; }
+
+.line2 {
+  width: 264px;
+  height: 1px;
+  background: #EA2349;
+  position: absolute;
+  top: 540px;
+  left: 45px; }
+
+.line3 {
+  width: 264px;
+  height: 1px;
+  background: #EA2349;
+  position: absolute;
+  top: 595px;
+  left: 45px; }
+
+.number1 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 510px;
+  left: 45px;
+  font-size: 16px; }
+
+.txt1 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 518px;
+  left: 69px;
+  font-size: 8px; }
+
+/******************************* */
+.number2 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 510px;
+  left: 121px;
+  font-size: 16px; }
+
+.txt2 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 518px;
+  left: 181px;
+  font-size: 8px; }
+
+/******************************* */
+.number3 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 510px;
+  left: 234px;
+  font-size: 16px; }
+
+.txt3 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 518px;
+  left: 259px;
+  font-size: 8px; }
+
+/******************************** */
+.continent1 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 553px;
+  left: 45px;
+  font-size: 7px;
+  letter-spacing: 0.4px; }
+
+.number4 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 562px;
+  left: 45px;
+  font-size: 7px; }
+
+.txt4 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 562px;
+  left: 54px;
+  font-size: 6px; }
+
+.number5 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 569px;
+  left: 45px;
+  font-size: 7px; }
+
+.txt5 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 569px;
+  left: 64px;
+  font-size: 6px; }
+
+/******************************** */
+.continent2 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 553px;
+  left: 121px;
+  font-size: 7px;
+  letter-spacing: 0.4px;
+  line-height: 9px;
+  width: 150px; }
+
+.number6 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 571px;
+  left: 121px;
+  font-size: 7px; }
+
+.txt6 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 571px;
+  left: 130px;
+  font-size: 6px; }
+
+.number7 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 578px;
+  left: 121px;
+  font-size: 7px; }
+
+.txt7 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 578px;
+  left: 145px;
+  font-size: 6px; }
+
+/******************************** */
+.continent3 {
+  position: absolute;
+  font-family: Gotham-Bold;
+  color: #A82149;
+  top: 553px;
+  left: 206px;
+  font-size: 7px;
+  letter-spacing: 0.4px;
+  line-height: 9px; }
+
+.number8 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 562px;
+  left: 206px;
+  font-size: 7px; }
+
+.txt8 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 562px;
+  left: 215px;
+  font-size: 6px; }
+
+.number9 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 569px;
+  left: 206px;
+  font-size: 7px; }
+
+.txt9 {
+  position: absolute;
+  font-family: GothamHTF-Book;
+  color: #A82149;
+  top: 569px;
+  left: 227px;
+  font-size: 6px; }
+
 /*# sourceMappingURL=style.css.map */
index 53132f8a057440cbb8010fe50028a681863fab13..b11ff04787f81ad3ff72b1ba137e4c5a9c0c9775 100644 (file)
@@ -1,6 +1,6 @@
 {
 "version": 3,
-"mappings": "AAAA,CAAC;EACC,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;;AACZ,OAAO;EACL,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,QAAQ;;AACpB,UAAU;EACR,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;;AACf,GAAG;EACD,QAAQ,EAAE,QAAQ;;AACpB,KAAK;EACH,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,KAAK;EACZ,GAAG,EAAE,KAAK;EACV,IAAI,EAAE,IAAI;;AACZ,KAAK;EACH,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,KAAK;EACZ,GAAG,EAAE,KAAK;EACV,IAAI,EAAE,IAAI;;AACZ,KAAK;EACH,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,KAAK;EACZ,GAAG,EAAE,KAAK;EACV,IAAI,EAAE,IAAI",
+"mappings": "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",
 "sources": ["style.sass"],
 "names": [],
 "file": "style.css"
index 92e9c646f5da98611654905193a0cd9e9869b92a..5fa8767c42824cb7f75a78e26c773556c2115950 100644 (file)
@@ -4,6 +4,17 @@
 #canvas
   display: none
   position: absolute
+$line: #EA2349
+$text: #A82149
+@font-face
+  font-family: Gotham-Bold
+  src: url("gotham-bold.woff")
+@font-face
+  font-family: GothamHTF-Book
+  src: url("gothamhtf-book.woff")
+@font-face
+  font-family: GothamHTF-medium
+  src: url("gotham-htf-medium.woff")
 .container
   width: 402px
   height: 750px
   position: absolute
   width: 264px
   top: 499px
-  left: 45px
\ No newline at end of file
+  left: 45px
+.numbers
+  position: absolute
+  top: 0
+.line1
+  width: 264px
+  height: 1px
+  background: $line
+  position: absolute
+  top: 499px
+  left: 45px
+.line2
+  width: 264px
+  height: 1px
+  background: $line
+  position: absolute
+  top: 540px
+  left: 45px
+.line3
+  width: 264px
+  height: 1px
+  background: $line
+  position: absolute
+  top: 595px
+  left: 45px
+.number1
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 510px
+  left: 45px
+  font-size: 16px
+.txt1
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 518px
+  left: 69px
+  font-size: 8px
+/********************************/
+.number2
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 510px
+  left: 121px
+  font-size: 16px
+.txt2
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 518px
+  left: 181px
+  font-size: 8px
+/********************************/
+.number3
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 510px
+  left: 234px
+  font-size: 16px
+.txt3
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 518px
+  left: 259px
+  font-size: 8px
+/*********************************/
+.continent1
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 553px
+  left: 45px
+  font-size: 7px
+  letter-spacing: 0.4px
+.number4
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 562px
+  left: 45px
+  font-size: 7px
+.txt4
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 562px
+  left: 54px
+  font-size: 6px
+.number5
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 569px
+  left: 45px
+  font-size: 7px
+.txt5
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 569px
+  left: 64px
+  font-size: 6px
+/*********************************/
+.continent2
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 553px
+  left: 121px
+  font-size: 7px
+  letter-spacing: 0.4px
+  line-height: 9px
+  width: 150px
+.number6
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 571px
+  left: 121px
+  font-size: 7px
+.txt6
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 571px
+  left: 130px
+  font-size: 6px
+.number7
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 578px
+  left: 121px
+  font-size: 7px
+.txt7
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 578px
+  left: 145px
+  font-size: 6px
+/*********************************/
+.continent3
+  position: absolute
+  font-family: Gotham-Bold
+  color: $text
+  top: 553px
+  left: 206px
+  font-size: 7px
+  letter-spacing: 0.4px
+  line-height: 9px
+.number8
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 562px
+  left: 206px
+  font-size: 7px
+.txt8
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 562px
+  left: 215px
+  font-size: 6px
+.number9
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 569px
+  left: 206px
+  font-size: 7px
+.txt9
+  position: absolute
+  font-family: GothamHTF-Book
+  color: $text
+  top: 569px
+  left: 227px
+  font-size: 6px
\ No newline at end of file