2016-07-13 4 views
1

私はシンプルなデモページを書くように求められており、fullpage.jsで解決しました。fullpageJS visual studio html

私は以前にhtmlとcssを使用していましたが、私は通常C++とC#で書いています。これは私の特権ではありません。私はしばらくの間、フロントエンドの仕事をしていません。

何らかの理由で、私が公式チュートリアルに従おうとすると、ページにスタイリングがなく、スクロールが機能しません。少しのテキストを含む単なる白いページ。

ビジュアルスタジオで簡単なページを設定するには、誰かが正しい方向に向けるのを助けることができますか?

<!DOCTYPE html> 
<html> 
<head> 
    <link href="Content/jquery.fullPage.css" rel="stylesheet" /> 
    <script src="scripts/jquery.fullPage.min.js"></script> 
    <script src="scripts/jquery-2.1.4.intellisense.js"></script> 
    <script src="scripts/jquery-2.1.4.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#fullpage').fullpage(); 
     }); 
    </script> 
</head> 

<body> 
    <div id="fullpage"> 
     <div class="section">Section 1</div> 
     <div class="section"> 
      <div class="slide">Section 2 Slide 1</div> 
      <div class="slide">Section 2 Slide 2</div> 
      <div class="slide">Section 2 Slide 3</div> 
     </div> 
     <div class="section">Section 3</div> 
    </div> 
</body> 
</html> 
+0

[このビデオチュートリアル](https://www.youtube.com/watch?v=F6602KMtq1Y)を見ましたか?または[提供された例](https://github.com/alvarotrigo/fullPage.js/tree/master/examples)を確認しますか? – Alvaro

答えて

0

あなたは正しい基本的な実装を持っているように見える彼らの例をダウンロードした後:ここ

は私が持っているhtmlページです。

唯一の違いは、彼らのサンプルプロジェクトのすべてがsectionsColor含まれていることである:それは、仕事の要素を検査し、コンソールタブを確認していない追加する場合は、この

$(document).ready(function() { 
    $('#fullpage').fullpage({ 
     sectionsColor: ['#f2f2f2', '#4BBFC3', '#7BAABE', 'whitesmoke','#ccddff'] 
    }); 
}); 

のようにプロパティを。あなたの依存関係に404エラーを出すかどうかを確認し、それらのパスに '../'は必要ないか、大文字と小文字の区別がないか、依存関係が正しい順序であることを確認してください。

しかし、このような魔法をやっていることですべてが壊れている場合、いくつかの場所には悪いビットがあり、見るべき機能が1つしかありません。

EDIT:これまで言及したように、fullpage.jsの下にjQueryがあります。 javascriptがそれらを順番に読み込んで実行するので、それを上回る必要があります。したがって、必要なjquery関数を見ることはできません。それを回して、あなたはうまくいくはずです。

関連する問題