jquery-smooth-scroll-Anker in wordpress

Ich versuche, umzusetzen jquery-smooth-scroll-Anker nach einem Klick auf den Menüpunkt im wordpress. Ich bin mit diesem Beispiel:

http://jsfiddle.net/YtJcL/

Hier ist die js-Datei:

 $(".anchor_scroll").click(function(event){
 event.preventDefault();
 //calculate destination place
 var dest=0;
 if($(this.hash).offset().top > $(document).height()-$(window).height()){
    dest=$(document).height()-$(window).height();
}else{
    dest=$(this.hash).offset().top;
}
//go to destination
$('html,body').animate({scrollTop:dest}, 5000,'swing');
});

In meinem wordpress-Seite, die ich erstellen Sie einen Abschnitt: 

<section id="services"></section>

und in der wordpress benutzerdefinierte Menü legen Sie eine Klasse "anchor_scroll" zu einem link:

<a class="anchor_scroll" href="#services">.

Danach habe ich in der Lage bin, Sie zur Navigation zu einem Anker in der Seite nach drücken auf den link, jedoch wird der jquery-code scheint nicht zu arbeiten, weil es keine glatte slide-Effekt, nur springen.

  • irgendwelche Fehler in der Konsole? wie sind Sie mit dem hinzufügen Ihr Skript in wordpress?
  • Versuchen Sie, diese $('#services').on('click', ".scroll", function (event) {
  • Ich sehe nicht, wie dies könnte helfen, speziell mit diesem Selektor (Sie Ziel das Ziel, nicht der link).
  • Melde ich mein script in functions.php Datei von meinem theme: wp_enqueue_script( 'anchor-slide', get_template_directory_uri() . '/js/anchor_slide.js', array()); ich sehen kann, in den Quellcode meiner Website ist, dass die .js-Datei geladen wird.
InformationsquelleAutor user2963789 | 2015-08-04
  1. 1

    Hier ist der code, den ich verwenden würde, für diese;

    $(".anchor_scroll").click(function(){
    var section = $(this).attr('href');
    $('html, body').animate({
        scrollTop: $(section).offset().top - 15
    });  
});
    InformationsquelleAutor McNab
Schreibe einen Kommentar