2016-09-01 15 views
1

最初に私は一般的にwebdesignにかなり新しいですので、私の質問はあまりにも愚かではないことを願っています。 私はfullpage jsを使ってウェブサイトを構築していて、セクションと一般的なレイアウトをかなり完成させました。今度は、右側の固定メニューが最初のメニューを除くすべてのページに表示されます。 この質問を検索して答えを見つけましたが、それは私にとってうまくいかないでしょう。 これは私のメニューです:フルページjsメニューは最初のページには表示されません

<ul id="menu"> 
    <li data-menuanchor="Home" class="active"><a href="#Home">Home</a></li> 
    <li data-menuanchor="About"><a href="#About">About</a></li> 
    <li data-menuanchor="Classes"><a href="#Classes">Classes</a></li> 
    <li data-menuanchor="pgClasses"><a href="#pgClasses">pgClasses</a></li> 
    <li data-menuanchor="Contact"><a href="#Contact">Contact</a></li> 
</ul> 

そのbodyタグ内ではなく#fullpage外。事前に助けを

$(document).ready(function() { 
    "use strict"; 

    $('#fullpage').fullpage({ 
     verticalCentered: true, 
     scrollingSpeed: 1200, 
     css3: true, 
     afterLoad: function(anchorLink, index) { 
      if (index > 1) { 
       $("#menu").fadeTo("slow", 1); 
      } 
     }, 
     onLeave: function(index, nextIndex, direction) { 
      if (index === 2 && direction === 'up') { 
       $("#menu").fadeTo("slow", 0); 
      } 
     } 
    }); 
}); 

ありがとう:

はここで私が見つけた機能を持つ私のjsファイルです。

更新:私は、セクション2以降でのみ表示されるはずのヘッダメニューもコードに挿入しようとしました。

$(document).ready(function() { 
"use strict"; 
$('#fullpage').fullpage({ 
verticalCentered: true, 
scrollingSpeed: 1200, 
css3: true, 
afterLoad: function(anchorLink, index){ 
    if (index === 1) { 
     $("header").fadeTo("fast",0); 
    } 
if (index > 1){ 
$("header").fadeTo("slow",1); 
} 
}, 
onLeave: function(index, nextIndex, direction){ 
if (index === 2 && direction === 'up') { 
$("header").fadeTo("slow",0); 
} 
}, 

、それがヘッダーのために働いているいくつかの理由のために:私は、JSファイルのこの

<header><ul id="topmenu"> 
    <li data-menuanchor="Home"><a href="#Home">Home</a></li> 
    <li data-menuanchor="About"><a href="#About">About</a></li> 
    <li data-menuanchor="Classes"><a href="#Classes">Classes</a></li> 
    <li data-menuanchor="pgClasses"><a href="#pgClasses">pgClasses</a></li> 
    <li data-menuanchor="Contact"><a href="#Contact">Contact</a></li> 
    </ul></header> 

とこれを使用していました。私がすべての "ヘッダー"を#menuに置き換えると、それでも何もしません。

明らかに#menuをulに変更すると動作します。

+0

再生を助けるのは難しいです。 – Alvaro

答えて

0

私はそれが正常に動作しますhttp://alvarotrigo.com/fullPage

.fp-viewing-firstPage #menu { 
    visibility: hidden; 
} 

でフルページデモのCSSファイルにこれを追加しました。明らかに、#menuから#Menuまでchangteする必要があります。

+0

残念ながら、私にとっては何もしないようです。とにかく男、ありがとう。 –

関連する問題