2017-11-14 5 views
0

Ich entwickle eine einzelne Seite Website, aber mein Slider bewegt sich nicht automatisch, auch nachdem ich das Skript hinzugefügt habe. Bitte helfen Sie mir dabei Ich möchte, dass sich mein Slider automatisch bewegt. Bitte finden Sie den folgenden HTML-Code unten:Slider bewegt sich nicht automatisch

 <div id="slider" class="sl-slider-wrapper"> 

      <div class="sl-slider"> 

       <div class="sl-slide" data-orientation="horizontal" data-slice1-rotation="-25" data-slice2-rotation="-25" data-slice1-scale="2" data-slice2-scale="2"> 

        <div class="bg-img bg-img-1"></div> 

        <div class="slide-caption"> 
         <div class="caption-content"> 
          <h2 class="animated fadeInDown">Lorem ipsum</h2> 
          <span class="animated fadeInDown">Lorem ipsum</span> 
          <a href="#" class="btn btn-blue btn-effect">Join US</a> 
         </div> 
        </div> 

       </div> 

       <div class="sl-slide" data-orientation="vertical" data-slice1-rotation="10" data-slice2-rotation="-15" data-slice1-scale="1.5" data-slice2-scale="1.5"> 

        <div class="bg-img bg-img-2"></div> 
        <div class="slide-caption"> 
         <div class="caption-content"> 
          <h2>Lorem ipsum</h2> 
          <span>Lorem ipsum</span> 
          <a href="#" class="btn btn-blue btn-effect">Join US</a> 
         </div> 
        </div> 

       </div> 

       <div class="sl-slide" data-orientation="horizontal" data-slice1-rotation="3" data-slice2-rotation="3" data-slice1-scale="2" data-slice2-scale="1"> 

        <div class="bg-img bg-img-3"></div> 
        <div class="slide-caption"> 
         <div class="caption-content"> 
          <h2>Lorem ipsum</h2> 
          <span>Lorem ipsum</span> 
          <a href="#" class="btn btn-blue btn-effect">Join US</a> 
         </div> 
        </div> 

       </div> 

      </div><!-- /sl-slider --> 

      <!-- 
      <nav id="nav-arrows" class="nav-arrows"> 
       <span class="nav-arrow-prev">Previous</span> 
       <span class="nav-arrow-next">Next</span> 
      </nav> 
      --> 

      <nav id="nav-arrows" class="nav-arrows hidden-xs hidden-sm visible-md visible-lg"> 
       <a href="javascript:;" class="sl-prev"> 
        <i class="fa fa-angle-left fa-3x"></i> 
       </a> 
       <a href="javascript:;" class="sl-next"> 
        <i class="fa fa-angle-right fa-3x"></i> 
       </a> 
      </nav> 


      <nav id="nav-dots" class="nav-dots visible-xs visible-sm hidden-md hidden-lg"> 
       <span class="nav-dot-current"></span> 
       <span></span> 
       <span></span> 
      </nav> 

     </div><!-- /slider-wrapper --> 

ich auch mein Script-Code bin hinzugefügt, die ich so hinzuzufügen versuchte, mir bitte die entsprechende Skript-Datei zu helfen, so dass mein Gleiteinrichtungsbewegungsbereich nach einem Intervall automatisch gestartet wird. meine das Skript finden:

// Carousel Auto-Cycle 
      $(document).ready(function() { 
      $('.sl-slider-wrapper').sl-slider-wrapper({ 
       interval: 1000 
      }) 
      }); 
+0

drücken Sie eins nach dem anderen – whoami

Antwort

0

Haben Sie sich den devtools Ihrer Seite, während er ausgeführt wird? Ich bin sicher, dass es einen Fehler zu werfen - das Javascript im Dokument-Ready-Funktion soll lauten:

... 
$('.sl-slider-wrapper').slitslider({ 
... 

Ich denke, es ist ein copy/paste Fehler in Ihrem Javascript.