0

基本的には横にスライドする1ページのレイアウトを作ってみました。私は何時間も苦労しましたが、それでも自分が何を間違っているのかわかりません。

JQueryとscrollToは前に<?php wp_head(); ?>(正しい順序で)含まれており、タイプミスの可能性を2回チェックしました。

Gereは私のhtmlマークアップです:

<div class="nav">
<a class="menu" href="#main">main</a>
<a class="menu" href="#bio">bio</a>
<a class="menu" href="#film">film</a><br>
</div>

<div id="wrap">
<div id="mask">
    <div class="panel" id="main"> </div>
    <div class="panel" id="bio"> </div>
    <div class="panel" id="film"> </div>
</div>
</div>

スクリプトは次のとおりです。

<script type='text/javascript'>
$(document).ready(function() {
$('a.menu').click(function () {

    $('a.menu').removeClass('active');
    $(this).addClass('active');

    current = $(this);

    $('#wrap').scrollTo($(this).attr('href'), 800);     

    return false;
});

});

</script>   

このスクリプトをサイトのいたるところに配置しようとしましたが、それでも機能しません。

4

1 に答える 1

0

基本的な考え方は理解できましたが、問題はスクロール可能なパネルとそのコンテナーの設定方法にあると思います。

上記のコードを例として使用して、基本的な ScrollTo スライド レイアウトを実装しました。

  • 垂直スクロール- http://jsfiddle.net/ZqSSm/1/ - の高さ#mask2400px(800px * 3) になることに注意してください。ただし、最初のスクロールのみ500pxが表示されます。

  • 水平スクロール- http://jsfiddle.net/ZqSSm/2/ - の幅が であることに注意してください#horizontalwrap2400pxただし、最初のスクロールのみ500pxが表示されます。

さらにサポートが必要な場合は、私に連絡してください。最善を尽くします。ScrollTo を初めて使用したときは、頭痛の種でした。

Web サイトに JS ファイルをロードする際にもいくつかの問題があることに注意してください。原因はわかりませんが、chrome の開発者コンソールまたは firebug を開くと、何が起こっているかがわかります。

于 2013-01-09T16:35:44.537 に答える