2016-05-11 11 views
0

Ich werde einfach Slider in JavaScript (ohne jquery) erstellen. Ich habe .xhtml Seite mit ungeordneter Liste:Einfach Schieberegler in JS funktioniert nicht

<ul> 
     <li class="slider"><img src="images/1.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/2.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/3.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/4.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/5.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/6.jpg" alt="asd" width="600px" height="400px" /></li> 
     <li class="slider"><img src="images/7.jpg" alt="asd" width="600px" height="400px" /></li> 
</ul> 

Es ist mein Skript:

var s = document.getElementsByClassName('slider'); 
function hide() 
{ 
    for(var i = 0; i < s.length; i++) 
    { 
     s[i].style.display = "none"; 
    } 
} 

var i = 0; 
function sw() 
{ 
    hide(); 
    s[i].style.display = "block"; 
    i++; 
    if (i >= s.length) i = 0; 
} 
hide(); 
sw(); 
setInterval(sw, 1000); 

Log.console zeigt mir diesen Fehler: Uncaught Typeerror: kann Eigenschaft 'Stil' undefinierten lesen.

+0

Wo in Ihrem HTML fügen Sie Ihre JS hinzu? –

+0

In der externen Datei main.js. Sein XHTML – Risksec7

+0

Aber wo ist Ihr Skript-Tag? Ist es in den Kopf? Die Unterseite des Körpers? Irgendwo dazwischen? –

Antwort

0

Sie versuchen, alle Ihre Elemente zu greifen, bevor sie geladen werden. Verschieben Sie Ihr <script>-Tag an den unteren Rand der <body>. Auf diese Weise werden Ihre Elemente in das DOM geladen.

<body> 
    <ul> 
    <li class="slider"></li> 
    ... 
    </ul> 
    <script src="javascript/main.js"></script> 
</body>