انیمیشین برای لوگوی قالب گراف2+دمو
سفارش تبليغات در انجــمن قالب گراف ورود به تاپيک اطلاعيه هاي تابستانه قالب گراف
امور گرافيکي و کدنويسي وب خود را به جي جي ميزبان بسپاريد
نام کاربري : پسورد : فراموش

سلام خدمت شما دوستان گرامی

امروز برای لوگوی قالب گراف یک انیمیشن طراحی کردم.

ا[font=BYekan]میدوارم که خوشتون بیاد[font=BYekan]

اگه خوشتون اومد تشکر نشه فراموش[font=BYekan]

جهت مشاهده سورپرایز روی نام قالب گراف هاور کنید.

[font=BYekan]

[font=BYekan][font=BYekan]

کـــــد:
کد:
<html class=""><head><script src="//production-assets.codepen.io/assets/editor/live/console_runner-5710c30fb566082d9fcb6e7d97ee7e3f2a326128c9f334a4231b6fd752b29965.js"></script><script src="//production-assets.codepen.io/assets/editor/live/events_runner-d5e4bf42585b8da8c18f7d963dbfc17cd66a79aa586c9448c4de8d6952ee9d97.js"></script><script src="//production-assets.codepen.io/assets/editor/live/css_live_reload_init-25d1423d5d6fb975e7d61832d2c061422a94963ca446583b965dfc5569147311.js"></script><meta charset="UTF-8"><meta name="robots" content="noindex"><link rel="shortcut icon" type="image/x-icon" href="//production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico"><link rel="mask-icon" type="" href="//production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111"><link rel="canonical" href="http://codepen.io/mjau-mjau/pen/KryHo">

<link rel="stylesheet prefetch" href="http://fonts.googleapis.com/css?family=Roboto:700"><style class="cp-pen-styles">body { text-align: center; padding: 30px;}.logo { -webkit-perspective: 250px; perspective: 250px; display: inline-block; font-family: Roboto, Impact; font-size: 5em; font-weight: bold; text-decoration: none; letter-spacing: -.05em;}.logo span { display: inline-block; }.m1 { color: #FFC000; }.m2 { color: #bec3c9 ; }</style></head><body><a href="http://mjau-mjau.com" class="logo"> <span class="m1 big" style="color: rgb(255, 192, 0); transform: rotateZ(0deg);">Ghaleb</span><span class="m2 big" style="color: rgb(190, 195, 201); transform: rotateZ(0deg);">Graph</span></a><script src="//production-assets.codepen.io/assets/common/stopExecutionOnTimeout-58d22c749295bca52f487966e382a94a495ac103faca9206cbd160bdf8aedf2a.js"></script><script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/0.0.22/jquery.velocity.min.js"></script><script>(function () { var logo = $('.logo'); var m1 = $('.logo .m1'); var m2 = $('.logo .m2'); var easings = [ 'easeOutQuad', 'easeInOutQuad', 'easeInOutBack', 'easeOutElastic', 'easeOutBounce' ]; var values = [ [ 20, 180, 0 ], [ 170, 170, 0 ], [ 20, 360, 0 ], [ 350, 0, 0 ], [ 0, 40, 360 ], [ 0, 320, 0 ], [ 0, 180, 0 ], [ 180, 180, 0 ] ]; m1.colh = [ 100, 110, 120 ]; m2.colh = [ 255, 192, 0 ]; logo.hover(function () { m1.logoanim(1); m2.logoanim(2); }, function () { m1.velocity('reverse'); m2.velocity('reverse'); }); $.fn.logoanim = function (item) { var duration = Math.round(Math.random() * 400) + 200; var a = Math.floor(Math.random() * values.length); var e = Math.floor(Math.random() * easings.length); var easing = easings[e]; if (e >= 2) { duration *= 2; } $(this).velocity({ rotateX: values[a][0] * (Math.round(Math.random()) * 2 - 1), rotateY: values[a][1] * (Math.round(Math.random()) * 2 - 1), rotateZ: values[a][2] * (Math.round(Math.random()) * 2 - 1), colorRed: this.colh[0], colorGreen: this.colh[1], colorBlue: this.colh[2] }, { duration: duration, easing: easing }); }; $(document).ready(function () { m1.logoanim(1); m1.velocity('reverse'); m2.logoanim(2); m2.velocity('reverse'); });}());//# sourceURL=pen.js</script></body></html>

امضاي کاربر :

طـــــــــــــــراحــــــــــــ و کُــــــــــــــــــــــــــد نـــــــــویـــــــــســـــــــــــ.
.

تَـــــــــــــحــــــــــــــــــتـــــِ وبـــــــــــــ
.
.
.



اِرتــــــــــــــتِــــــــــــبــــــــــاطــــــــ بــــــــا
.
.
.
بَـــــــــــنـــــــــــد هــــــــــ :
.
.
.


تشکر شده:

2 کاربر از lamborghini به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow / 78nbm78 /

پاسخ ها

براي نمايش پاسخ جديد نيازي به رفرش صفحه نيست روي تازه سازي پاسخ ها کليک کنيد !