آموزش ساخت دکمه هدایت به بالا با انیمیشن

با سلام خدمت همه هایپری ها همونطور که میدونید پرچممون خیلی بالاست دی :|

چطورید ؟خوبین ؟خوشین ؟ سلامتین؟امروز با شما هستیم با یه مطلب آموزشی مفید ساده در خدمتتون هستم که حدود 30 درصد کدنویسا دنبال این کد هستند که در اوج سبکی کد، دکمه هدایت به بالا با انیمیشن بسازند اما با یه سری کد چرت و پرت 50 خطی مواجه میشند و منصرف میشند.این  کد جی کوئری رو به شما تقدیم میکنیم و امیدواریم براتون مفید واقع شه.

با سلام خدمت همه هایپری ها همونطور که میدونید پرچممون خیلی بالاست دی :|

چطورید ؟خوبین ؟خوشین ؟ سلامتین؟امروز با شما هستیم با یه مطلب آموزشی مفید ساده در خدمتتون هستم که حدود 30 درصد کدنویسا دنبال این کد هستند که در اوج سبکی کد، دکمه هدایت به بالا با انیمیشن بسازند اما با یه سری کد چرت و پرت 50 خطی مواجه میشند و منصرف میشند.این  کد جی کوئری رو به شما تقدیم میکنیم و امیدواریم براتون مفید واقع شه.

این کد رو head قالبتون قرار بدین:

<script type="text/javascript"> //<HYPERTEMP> Go TO UP BY </HYPERTEMP> $(function (){ $(window).scroll(function (){ if ($(this).scrollTop() != 0) { $('#back-to-top').fadeIn(); } else { $('#back-to-top').fadeOut(); } }); $('#back-to-top').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); }); }); </script>

این کد هم هر جا دلتون خواست توی body قرار بدین و هر استایلی دلتون خواست بهش بدین:

<a id="back-to-top">برو بالا</a>

ابزارشم سرم خلوت شد براتون میسازم.