
جی کوئری یکی از محبوب ترین فریم ورک های جاوا اسکریپته (چرا دارم اینارو میگم؟! خودتون میدونید دیگه:دی)
اما حجم تقریبا زیاد جیکوئری با نت های ما یکم مشکل داره! به طوری که میبینی طرف جی کوئری رو اتچ کرده بعد از دو سه تا پلاگین دیگه هم استفاده کرده میرم ناهار میخورم میام میبینم هنور سایت کامل لود نشده :| یا امواج گرانشیِ انیشتین !
با این توصیفات اگه از بوت استرپ و اینا استفاده نکردین بهتره جی کوئری رو اتچ نکنین (هر چند کش میشه ولی بار اولشم پدر آدمو درمیاره خب)
تو این پست قصد دارم بهتون یاد بدم جچوری بدون استفاده از جی کوئری و با استفاده از جی کوئری یه بالابر واسه خودتون کدنویسی کنین.
اما حجم تقریبا زیاد جیکوئری با نت های ما یکم مشکل داره! به طوری که میبینی طرف جی کوئری رو اتچ کرده بعد از دو سه تا پلاگین دیگه هم استفاده کرده میرم ناهار میخورم میام میبینم هنور سایت کامل لود نشده :| یا امواج گرانشیِ انیشتین !
با این توصیفات اگه از بوت استرپ و اینا استفاده نکردین بهتره جی کوئری رو اتچ نکنین (هر چند کش میشه ولی بار اولشم پدر آدمو درمیاره خب)
تو این پست قصد دارم بهتون یاد بدم جچوری بدون استفاده از جی کوئری و با استفاده از جی کوئری یه بالابر واسه خودتون کدنویسی کنین.
خب اول از آسونه شروع می کنیم! از جی کوئری اول استفاده کنیم که کد ما به این شکل خواهد بود :
اول چی کوئری رو اتچ کنیم: بلدین که!
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
خب بعد از این با استفاده از animate کارمونو میکنیم:
$('.tbnu').click(function(){ $('html,body').animate({scrollTop:0},800)})
دیدین چقدر راحت بود؟:دی اینم دمـــــــــو
خب حالا اون مال تنبلا بود! اونایی که میخوان یکم به خودشون زحمت بدن بقیه رو ببینن!
حالا ما با جاوا اسکریپت یه تابعی رو مینویسیم که طول کل صفحه رو به ما بده و بعد توی آرگومانی به اسم meter عددی رو ذخیره میکنیم که با آرگومان delay ای که ما میدیم(زمانی که این کارو تکرار میکنه) با استفاده از window.scrollBy از کل اسکرول کم کنه.البته وسط وسطاش باید چک کنیم که اگه کاملا به بالای صفحه رسیدیم دیگه این کارو متوقف کنه یعنی clearInterval !
پس ما داریم:
/* * Scroll Upper By Ehsan Abafat * Copyright 2016 By Monister.ir * All Rights Reserved. */ function GoTop(meter, delay) { var inter = setInterval(function () { var pagey = (typeof window.pageYOffset === "number") ? window.pageYOffset : document.documentElement.scrollTop; if (pagey === 0) clearInterval(inter); else window.scrollBy(0, -meter); }, delay); }اینم دمــــــــوی این!
نظرات کاربران
1. سوالات نامربوط با مطلب فوق را در انجمن بپرسید.
2. نظرات محتوی هر گونه فحاشی اگر چه تایید می شوند ولی قسمت های ناپسند آن فیلتر می شود.
3. لطفا برای دریافت پاسختون هر از گاهی به نظرات مطلب مورد نظر سر بزنید.