0

小さな単一ページのワードプレス テーマを構築しようとしていますが、ナビゲーション メニューを機能させる方法を見つけるのに苦労しています。

ページはこの関数で読み込まれます: http://pastebin.com/Di5MhS8y . 各ページは、その menu_order に基づいて、私のホームページのセクションとして表示されます。

私のウェブサイトの外にリンクするカスタムメニューの音声を作成すると（www.google.comで試してみました）、メニューは正常に機能します。Web サイトの特定のセクションにリンクしようとすると、問題が発生します。ページ全体がリロードされ、トップに戻ります。

各セクションに特定のIDを付けてリンクする必要があると思いますが、よくわかりません。どんな提案でも大歓迎です！

4

1 に答える 1

0

最良の方法は、各セクションに ID を与えることです。クリーンな URL が必要な場合は、Jquery で関数を作成できます

これは私が1ページのウェブサイトで使用したものです

var locationPath = filterPath(location.pathname);
      var scrollElem = scrollableElement('html', 'body', 'document', 'window');
      //console.log(scrollElem);

      $('a[href*=#]').each(function() {
        var thisPath = filterPath(this.pathname) || locationPath;
        if (  locationPath == thisPath
        && (location.hostname == this.hostname || !this.hostname)
        && this.hash.replace(/#/,'') ) {
          var $target = $(this.hash), target = this.hash;
          if (target) {
            //console.log('Target: ' + target + ' offset: ' + targetOffset);
            $(this).click(function(event) {
                var targetOffset = $target.offset().top;
              event.preventDefault();
              $(scrollElem).animate({scrollTop: targetOffset}, 1000, function() {
              //console.log($(scrollElem).scrollTop());
                location.hash = target;
                $(scrollElem).animate({scrollTop: targetOffset}, 0);
              });
            });
          }
        }
      });

      // use the first element that is "scrollable"
      function scrollableElement(els) {
        for (var i = 0, argLength = arguments.length; i <argLength; i++) {
          var el = arguments[i],
              $scrollElement = $(el);
          if ($scrollElement.scrollTop()> 0) {
            return el;
          } else {
            $scrollElement.scrollTop(1);
            var isScrollable = $scrollElement.scrollTop()> 0;
            //console.log(el + ': ' + $scrollElement.scrollTop());
            $scrollElement.scrollTop(0);
            if (isScrollable) {
              return el;
            }
          }
        }
        return 'body';
      }
于 2013-06-07T21:02:53.550 に答える