Question

我目前正在使用unslider，但我的网站没有响应。我不确定为什么它没有响应，因为我把它设置为流动。

以下代码：

 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="http://unslider.com/unslider.min.js"></script>
   <script>
        $(document).ready(function() {
         $('.banner').unslider({
            speed: 600,   //Speed in milliseconds
            delay: 4000, // To delay between slide (in milliseconds
            keys: true,
            fluid: true,
            dots: true 

            });
         });
 </script>

我是否需要在CSS文件中执行某些操作，或者是否需要将图像设置为％

谢谢！

以下是HTML：

<div class="banner">
    <ul =" col span_6_of_6">
        <li><img src='Images/farmimg1.jpg' width="1000" height="577" alt= "Farm Photo"></li>        
        <li><img src = "Images/tunisewefield.jpg" width="1000" height= "577" alt= "Tunis Ewe in field"></li>
        <li><img src = "Images/barnsimg.jpg"width="1000" height= "577" alt= "Wise Family Sheep Farm"></li>
        <li><img src= "Images/sheepfield.jpg" width= "1000" height = "577" alt= "Sheep in Field"></li>
    </ul>
</div>

Answer 1

正如其他人所说，最好是从内嵌图像中删除宽度和高度。我保持图像响应的建议是为每个图像添加响应类。像这样：

<li><img class="img-resposive" src='Images/farmimg1.jpg' alt= "Farm Photo"></li>

虽然img-resposive看起来像：

.img-resposive{
  width: 100%;
  height: auto;
}

unslider没有表现出反应

1 个答案: