2016-04-03 5 views
1

私は4枚の写真をカルーセルで自動的に再生しようとしていますが、Slickは写真などをフォーマットしていません。誰かが私が何をやっているのか、それを修正するために何ができるのかを私に見せてもらえますか?ここの推測を作るSlick Carouselフォーマットしていない

<!DOCTYPE html> 
 

 
<head> 
 
<meta charset="UTF-8"> 
 

 
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.css"/> 
 

 
<style> 
 
photo-show { 
 
\t width: 40%; 
 
} 
 
</style> 
 

 

 
</head> 
 

 
<body> 
 

 
<div class="photo-show"> 
 
<div><img src="./src/cat1.jpg" alt=""></div> 
 
<div><img src="./src/cat2.jpg" alt=""></div> 
 
<div><img src="./src/cat3.jpg" alt=""></div> 
 
<div><img src="./src/cat4.jpg" alt=""></div> 
 
</div> 
 

 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
 
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script> 
 

 
<script type="text/javascript"> 
 
    $(document).ready(function(){ 
 
     $('.photo-show').slick({ 
 
     slidesToShow: 4, 
 
     slidesToScroll: 1, 
 
     autoplay: true, 
 
     autoplaySpeed: 2000, 
 
     }); 
 
    }); 
 
</script> 
 

 

 
</body>

+1

「写真などをフォーマットする」とはどういう意味ですか? – jono

+0

どのように写真をフォーマットしますか?画像が読み込まれているか、壊れていますか? – Scott

答えて

1

あなたはスリック写真にスタイルを適用しようとしているように、それが見えます。あなたのCSSは間違っていて、画像をフォーマットしません。

代わりにこのCSS試してみてください: "" 私はAを追加

<style> 
.photo-show img { 
    width: 40%; 
} 
</style> 

お知らせphoto-showと特定のimgの前に、あなたの画像をphoto-showコンテナ内でスタイリングすることができます。

関連する問題