2017-12-10 9 views
1

Concrete5で別のページのセクションにリンクしようとしていますが、動作させることができません。リンクにカーソルを合わせると、ウィンドウの左下(Chrome)に正しい住所が表示されます。ただし、リンクをクリックしても何も起こりません(アドレスバーにテキストは表示されず、ページ上に何も変わりません)。Concrete5:別のページへのリンクを開くときにアンカーにスクロール

私の教授は、未定義の「トップ」プロパティエラーが発生しているため、JSファイルの問題だと思っているようです。

マイリンク:
<a href="<?=$this->url('programs');?>#delinquencyprogram">Delinquency Intervention + Prevention</a>

所望の最終場所:
http://maysp.tylerhalldesigns.com/index.php/programs#delinquencyprogram

アンカー:
<hr id="delinquencyprogram" class="anchor">

のjQuery:

 $(document).ready(function(){ 
    // Add smooth scrolling to all links 
    $("a").on('click', function(event) { 

    // Make sure this.hash has a value before overriding default behavior 
    if (this.hash !== "") { 
     // Prevent default anchor click behavior 
     event.preventDefault(); 

     // Store hash 
     var hash = this.hash, 
      nav = $('nav'); 

     // Using jQuery's animate() method to add smooth page scroll 
     // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area 
     if (nav.height) { 
     $('html, body').animate({ 
     scrollTop: $(hash).offset().top 
     }, 800, function(){ 

     // Add hash (#) to URL when done scrolling (default click behavior) 
     window.location.hash = hash; 
     }); 
    } 
    } // End if 
    }); 
}); 

私はNAVのためのVARを作成する必要がある場合、または(nav.length)スニペットが達成されたまさに場合、私はjQueryの/ JSの非常に初心者に理解していると確認していません(それは私がジャンプしていたオブジェクトがコンテンツを持っているかどうかを判断していたということでした)。

開発者ツールでのエラー:

Uncaught TypeError: Cannot read property 'top' of undefined 
at HTMLAnchorElement.<anonymous> (maysp.js:79) 
at HTMLAnchorElement.dispatch (jquery.js:4) 
at HTMLAnchorElement.r.handle (jquery.js:4) 

任意のより多くの情報を私は提供させていただき必要な場合。

ウェブサイトはここで見ることができます:http://maysp.tylerhalldesigns.com/index.php

それはプログラムのページにリンクする必要があり、そのホームページ上の明るいカラフルなボタンです。また、navを使ってリンクするときも同じ問題があります(Programs> Success)。

ありがとうございます!

答えて

0

私は同僚にこれを助けてくれるよう頼みました。彼はJSスムーススクロールコードを完全に削除してアンカーがなくても動作するかどうかを確認するよう提案しました。彼らはやったので、私は私の現在のコードを削除し、次でそれを置き換える:

$(document).ready(function(){ 
    $('a[href*=#]:not([href=#])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
     || location.hostname == this.hostname) { 

     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
      if (target.length) { 
       $('html,body').animate({ 
        scrollTop: target.offset().top 
      }, 800); 
      return false; 
     } 
    } 
}); 
}); 

これは、ページ上のすべてのリンクへのスムーズなスクロール効果を適用します。

私はこれが、私がそうであったような日々についた人にも役立つことを願っています!

関連する問題