2012-12-18 2 views
0

jquery img 슬라이더에 문제가 있습니다 ... 표시가되지 않습니다 ... 내가 뭘 잘못하고 있는지에 대한 아이디어 ... div myslideshow가 안에 들어 있습니다. 내용 div.jQuery img 슬라이더가 작동하지 않습니다.

내가 방화 광에서 소스 코드를 볼 때 내가 마크 업이와 사진이 제대로 연결되고있는 것을 볼 수 있습니다 - 슬라이더 그냥 실 거예요 시작 .. 여기

는 플러그인과 CSS를 들어, 스크립트 HTML 마크 업입니다

<div id="myslideshow"> 
       <ul class="bjqs"> 
       <li><img src="img/slidepic1.png" height="330" width="986" alt="slide1"/></li> 
       <li><img src="img/slidepic2.png" height="330" width="986" alt="slide2"/></li> 
       <li><img src="img/slidepic3.png" height="330" width="986" alt="slide3"/></li> 
       <li><img src="img/slidepic4.png" height="330" width="986" alt="slide4"/></li> 
       </ul> 
      </div> 

!-- Load jQuery og plug-in til slider galleriet--> 
<script type="text/javascript" src="js/vendor/jquery-1.8.1.js"></script> 
    <script type="text/javascript" src="js/basic-jquery-slider.js"></script> 

    <!-- funktionen for selve animationen mm. --> 
    <script type="text/javascript"> 
     $(document).ready(function() { 

     $('#myslideshow').bjqs({ 
      'width' : 970, 
      'height' : 520, 
     'animationDuration' : 1200, 
    'showMarkers' : false, 
    'centerControls' :true, 
    'useCaptions' : false, 
    'keyboardNav' : false, 
    'showControls' : false, 
     }); 

     }); 
    </script> 



/* Basic jQuery Slider essential styles */ 

ul.bjqs{ 
    position:relative; 
    list-style:none; 
    padding:0; 
    margin:0; 
    overflow:hidden; 
    display:none; 
} 
.bjqs-slide li{ 
    display:none; 
    position:absolute; 
} 

ul.bjqs-controls li a{ 
    display:block; 
    padding:5px 10px; 
    position:absolute; 
    background:#fff; 
    color:#fd0100; 
    text-decoration:none; 
    text-transform:uppercase; 
} 

a.bjqs-prev{ 
    left:0; 
} 

a.bjqs-next{ 
    right:0; 
} 

p.bjqs-caption{ 
    background:rgba(0,0,0,0.7); 
    color:#fff; 
    text-align:center; 
} 

ol.bjqs-markers{ 
    position:absolute; 
    bottom:-50px; 
} 

ol.bjqs-markers li{ 
    float:left; 
    margin:0 3px; 
} 

ol.bjqs-markers li a{ 
    display:block; 
    height:10px; 
    width:10px; 
    border:4px solid #fff; 
    overflow:hidden; 
    text-indent:-9999px; 
    background:#000; 
    border-radius:10px; 
    box-shadow:0 0 50px rgba(0,0,0,0.5); 
} 

ol.bjqs-markers li.active-marker a{ 
    background:#fd0100; 
} 
+1

'showControls': false, 'showControls'와 같이이 여분을 제거했습니다. 거짓 – underscore

+0

어디에서이 링크를 공유 할 수 있습니까? – underscore

+0

@SamithaHewawasam은 절대적으로 옳습니다. jsfiddle 또는 [codepen] (http://codepen.io/)을 만들 수 있습니까? –

답변

0

방화범이 아닌 귀하의 페이지에서 자바 스크립트를 감지 할 수 있습니다. 하지만 jquery와 스크립트에 대한 참조가 있음을 알았습니다.

관련 문제