2016-07-13 17 views
1

Ich wurde gebeten, eine einfache Demo-Seite zu schreiben und wir haben uns auf fullpage.js festgelegt.fullpageJS visual studio html

Ich habe HTML und CSS vor, ich schreibe normalerweise in C++ und C# so das ist nicht meine Stärke. Ich habe seit einiger Zeit keine Front-End-Arbeit gemacht.

Aus irgendeinem Grund, wenn ich versuche, dem offiziellen Tutorial zu folgen, hat meine Seite kein Styling und der Bildlauf funktioniert nicht. nur eine weiße Seite mit ein bisschen Text.

Kann mir jemand helfen, mich in die richtige Richtung zu weisen, um eine einfache Seite im Visual Studio einzurichten?

hier ist die HTML-Seite, ich habe:

<!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

Haben Sie [dieses Video-Tutorial] (https://www.youtube.com/watch?v=F6602KMtq1Y) gesehen? Oder überprüfen Sie die [mitgelieferten Beispiele] (https://github.com/alvarotrigo/fullPage.js/tree/master/examples)? – Alvaro

Antwort

0

Nach ihrem Beispiel das Herunterladen es sieht aus wie Sie die grundlegende Implementierung korrekt sind.

Der einzige Unterschied ist, dass alle ihre Beispielprojekte umfassen eine sectionsColor: Immobilien wie diese

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

Wenn fügte hinzu, dass nicht funktioniert, Element inspizieren und die Registerkarte Konsole überprüfen. Sehen Sie, ob es Ihnen einen 404-Fehler für Ihre Abhängigkeiten gibt, und stellen Sie sicher, dass all diese Pfade kein '../' benötigen, oder eine schlechte Großschreibung haben, oder Abhängigkeiten in der richtigen Reihenfolge sind.

Aber wenn alles mit etwas bricht, was so viel Magie für Sie tut, gibt es ein schlechtes Stück von etwas Platz und Sie haben nur eine Funktion zu betrachten.

EDIT: Nun, da ich es erwähne, haben Sie jQuery unter Fullpage.js. Es muss darüber sein, wie JavaScript liest und diese in der Reihenfolge ausführt. So kann es die jquery Funktionen nicht sehen, die es benötigt. Schalten Sie das um und Sie sollten in Ordnung sein.