0

scrollTojqueryを機能させようとしています。さまざまな家庭教師/方法を試しましたが、どれもうまくいかないようです。私はそれをWPサイトに使用していますが、私の考えでは、いくつかのjsファイルが互いに混乱しています。次の.jsが使用されています。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery-ui-1.8.18.custom.min.js"></script>
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/my_script.js"></script>
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery.hoverscroll.js"></script> 
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery.scrollto-1.4.2-min.js"></script>

そして私はこれを使って発砲します:

$(document).ready(function(){ $("#box1btn").click(function(){ $("#ommig").slideto({ slide_duration: 5000, }); }); });

しかし、スライドは...スライドしていません。アンカーのためにジャンプしているだけです。

<a id="box1btn" href="#ommig">Om Mig</a>
<div id="ommig">Title</a>

ソース:http ://djpate.com/2011/01/01/animated-scrollto-effect-jquery-plugin/

NB!Ariel Fleslerのscrolltoも使用しましたが、同じです。

何か案は?よろしくお願いします。

4

2 に答える 2

4

アンカータグをクリックした場合の影響に対抗するには、を使用する必要がありますevent.preventDefault()

$(document).ready(function(){
    $("#box1btn").click(function(event){
        event.preventDefault();  
        $('html, body').animate (
             {scrollTop: $('#ommig').offset().top}, 5000
        );        
    });
});

ここで実際の動作を確認してください:http://jsfiddle.net/mhnmt/1/

編集:Chromeの問題を修正するためににdocument.documentElement戻りました。'html, body'

于 2012-06-03T15:48:11.653 に答える
1

通常、私は次のようなものを使用します:

var targetOffset = $('#ommig').offset().top; 
$('html,body').animate({scrollTop: targetOffset}, 5000});

また、falseを返す必要がある場合もあります。クリックイベントで、それ以外の場合、ブラウザはそれ自体で目的地に移動するか、単に次のようなことをします。

<a id="box1btn" href="javascript:;">Om Mig</a>
<div id="ommig">Title</a>

$(document).ready(function(){ 
$("#box1btn").click(function() {
    var targetOffset = $('#ommig').offset().top; 
    $('html,body').animate({scrollTop: targetOffset}, 5000});
});
});
于 2012-06-03T15:04:36.910 に答える