0

すでに機能しているサイトにjCarouselLiteを組み込みましたが、[前へ]ボタンと[次へ]ボタンが表示されますが、画像は表示されません。画像のリンクは正しいです。

何か案は？

jQUERY：

<script type="text/javascript">
    //jCarouselLite
    $(function() {
        $(".slider").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        visible: 4
    });
});
</script>

HTML：

<div id="list">           
<div class="prev"><img src="images/prev.jpg" alt="prev" /></div>
<div class="slider">
<ul>
<li><a href="#" title="Title 1"><img src="images/store_item_img.jpg" alt="Image 1" class="captify" /></a></li>
<li><a href="#" title="Title 2"><img src="images/store_item_img.jpg" alt="Image 2" class="captify" /></a></li>
<li><a href="#" title="Title 3"><img src="images/store_item_img.jpg" alt="Image 3" class="captify" /></a></li>
<li><a href="#" title="Title 4"><img src="images/store_item_img.jpg" alt="Image 4" class="captify" /></a></li>
<li><a href="#" title="Title 5"><img src="images/store_item_img.jpg" alt="Image 5" class="captify" /></a></li>
<li><a href="#" title="Title 6"><img src="images/store_item_img.jpg" alt="Image 6" class="captify" /></a></li>
<li><a href="#" title="Title 7"><img src="images/store_item_img.jpg" alt="Image 7" class="captify" /></a></li>
<li><a href="#" title="Title 8"><img src="images/store_item_img.jpg" alt="Image 8" class="captify" /></a></li>
</ul>
</div>
<div class="next"><img src="images/next.jpg" alt="next" /></div> 
</div>

CSS：

.slider {
 background-color:#3399FF;
 float:left;
 margin:15px; 
 position:relative; 
 visibility:hidden; 
}

.slider ul {
 height:180px;
 width:840px; 
}

.slider ul li {
 padding:0 20px;
}

.slider ul li img {
 cursor:pointer;
 height:150px; 
 padding-top:3px;
 width:180px;  
}

.prev {
 cursor:pointer; 
 float:left;
 padding-top:90px;
}

.next {
 cursor:pointer; 
 float:right; 
 padding-top:90px;
}

脚本：

<script type="text/javascript" src="http://www.theratio.net/js/jquery.js"></script>
<script type="text/javascript" src="js/jcarousellite_1.0.1.pack.js"></script>
<script type="text/javascript" src="js/captify.tiny.js"></script>

助けてください？

:)

アップデート：

削除した場合

  $("#store_container").hide();

..そしてそれをこのように見せてください、それは働きます、しかしdivは閉じられる代わりに最初に開かれます。

<script type="text/javascript">
$(function(){
  $('#toggle').toggle(function(){
     $('#store_container').slideDown("slow", function() { $('#store_data').fadeIn(); });
   }, function() {
     $('#store_data').fadeOut("fast", function() { $('#store_container').slideUp("slow"); });
  });
});
</script>

.hideを使用して#store_containerを閉じるにはどうすればよいですか？または、関数がクリックされた後にそれを表示する方法はありますか？

4

3 に答える 3

2

jCarouselLiteについては何も知りませんが、あなたのスタイルでは、.sliderがに設定されてvisibility:hidden;おり、コードに表示されるものは何もありません。

編集：

忘れないで：

$('document').ready(function(){
    // my jquery javascript code
})
于 2010-02-03T20:00:33.543 に答える
0

あなたはこれを理解しましたか？画像には、高さと幅の属性が必要です。

于 2010-07-09T06:46:15.430 に答える
0

jQueryスクリプトとjCarouselLiteスクリプトが正しく含まれていることを確認しますか？Firebugはスクリプトを表示しますか？エラーはありますか？

于 2010-02-03T19:55:38.880 に答える