javascript - unslider 没有反应

标签 javascript jquery html css

我目前正在使用 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>  

最佳答案

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

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

虽然 img-resposive 看起来像:

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

关于javascript - unslider 没有反应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20585982/

相关文章:

javascript - jQuery datepicker 发布错误的日期值

javascript - 使用 jquery 检查 css 媒体查询不起作用

javascript - 使用 jQuery cookie 在下拉选择框中选择一个值

jquery - 基本 html 使用 jQuery 加载不继承样式的顶部导航菜单

html - 介质类型打印什么

javascript - 如何正确使用jquery prev?

javascript - 如何将数据从一个ejs文件发送到另一个ejs文件

javascript - 如何将 ID 值添加到 div 追加

jquery - 移动/大型基础 6 的粘性导航

javascript - 在 Firefox 中禁用 cookie 后,访问本地存储会出现安全错误