2014-10-16 3 views
1

Я имею эту ссылку якорный со страницы А, abc.com/news#section2JQuery свиток с анкерной ссылки на другую страницу смещение заголовка

В странице новостей, блоки заголовка в верхней части секции 2. Я попытался чтобы компенсировать его в jquery, но он не работает. Надеюсь, кто-то может помочь, спасибо заранее!

jQuery('.ch-item a').click(function(e) { 

    var link = jQuery(this); 
    var target = jQuery(link.attr('href').substring(link.attr('href').indexOf('#'))); 
    if(target.length > 0) { 
     jQuery('html, body').stop().animate({scrollTop: target.offset().top - jQuery('.header_container').outerHeight()}, 1000); 
     e.preventDefault(); 
    } else if(options.preventNonLink) { 
     e.preventDefault(); 
    } 
});`` 

ответ

1

дать попробовать на этот

$(document).ready(function() { 
    $('a[href^="#"]').on('click', function (e) { 
     e.preventDefault(); 
     var target = this.hash; 
     var t = $(this.hash).offset().top; 
     $('html, body').stop().animate({ 
     scrollTop: t, 
     }, 1000, function() { 
      window.location.hash = target; 
     }); 
    }); 
}); 
+0

Привет, спасибо за вашу помощь. Я помещал это в свой глобальный файл js, потому что я использую тему WordPress. Я также добавил предупреждение после функции onclick, но функция вообще не вызывалась. Любая идея почему? Еще раз спасибо – Sylph

+0

Проверьте, есть ли какие-либо ошибки в консоли? –

+0

только что проверено, нет ошибки, но это просто не называется. Позвольте мне попробовать добавить отдельный файл и посмотреть – Sylph

0

Это якорь исправить фрагмент написан для JQuery. Он запускается при загрузке страницы и изменяется хеш (на привязках на странице).

(function($, window) { 
 
    var adjustAnchor= function() { 
 

 
    var $anchor = $(':target'), 
 
    \t fixedElementHeight = 100; 
 

 
    if ($anchor.length > 0) { 
 

 
     $('html, body') 
 
     .stop() 
 
     .animate({ 
 
      scrollTop: $anchor.offset().top - fixedElementHeight 
 
     }, 200); 
 

 
    } 
 

 
    }; 
 

 
    $(window).on('hashchange load', function() { 
 
    adjustAnchor(); 
 
    }); 
 

 
})(jQuery, window);

Это будет рассматривать URL на странице загрузки, чтобы увидеть, если есть якорь затем настроить страницу на 100px от верхней части мишени.

Edit: отрегулировать, чтобы сделать регулировку высоты очевидной

В тот же обезображенный:

!function(o,n){var t=function(){var n=o(":target"),t=100;n.length>0&&o("html, body").stop().animate({scrollTop:n.offset().top-t},200)};o(n).on("hashchange load",function(){t()})}(jQuery,window); 
+0

Если вам не нравится анимация, замените функцию $ ('html, body') ... на: 'window.scrollTo (0, $ anchor .offset(). top - fixedElementHeight); ' – Lance

Смежные вопросы