طراحی سایت در تهران

یک افکت کاربردی برای قسمت منو در وب سایت

اکثرا در سایت ها منوی اصلی به صورت ثابت قرار دارد، یعنی وقتی کاربر صفحه رو بالا و پایین میکند منو همیشه در بالای صفحه به صورت ثابت قرار دارد. اما خیلی اوقات منو باعث شلوغ تر شدن صفحه می شود. برای رفع این مشکل می توان منو را در هنگام اسکرول به پایین، حذف کرد. و در هنگام اسکرول به بالا مجددا نمایش داد.برای این منظور کافی ست کد زیر را در قسمت هدر سایت قرار دهید.

$(function () {var lastScrollTop = 0;var $navbar = $(‘.upmenu’);
$(window).scroll(function(event){var ht = $(this).scrollTop();
if (ht > lastScrollTop) { // scroll down
// use this is jQuery full is used$navbar.fadeOut()
// use this to use CSS3 animation// $navbar.addClass(“fade-out”);// $navbar.removeClass(“fade-in”);
// use this if no effect is required// $navbar.hide();} else { // scroll up
// use this is jQuery full is used$navbar.fadeIn()
// use this to use CSS3 animation// $navbar.addClass(“fade-in”);// $navbar.removeClass(“fade-out”);
// use this if no effect is required// $navbar.show();}lastScrollTop = ht;});});