اسکرول نرم برای Bookmark Anchor Link ها در طراحی وب سایت

در ابتدا برای دوستانی که Bookmark Anchor Link نمیدانند چیست , بهتر است این لینک را مطالعه فرمایند …

این مدل لینک دهی در سایت wikipedia به وفور یافت میشود و به این معنا میباشد که شاید شما بخواهید کاربر پس از ورود به صفحه ی مورد نظر خود , به نقطه ای مشخص از آن صفحه برود . مثلا فرض کنید در یک تگ h1 در وب سایت خود دارید که میخواهید کاربر پس از کلیک بر روی لینک شما , به همان تگ h1 پرش کند . برای این کار باید مراحل زیر را انجام دهید .

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

برای انجام اسکرول نرم کافیست کد زیر را در فایل html خود وارد نمایید . ( قبل از بسته شدن تگ <body/> مناسب تر میباشد .

نکته بسیار مهم : این کد به صورت جی کوئری می باشد . پس حتما باید کتابخانه جی کوئری بر روی وب سایت شما نصب باشد .

<script>
$(document).ready(function(e) {
	$("a[href*='#']").click(function(){
		$('html, body').animate({
			scrollTop: $( $.attr(this, 'href') ).offset().top
			}, 500);
		return false;
	});
});
</script>

توجه : شما میتوانید با تغییر عدد 800 در کد بالا , سرعت را کم یا زیاد نمایید و

دموی آماده کد

پخش اختصاصی

آموزش : وحید مجیدی