试图让 bxslider 在图像之间淡入淡出。这工作正常,除了下一个图像没有淡入,而是它只是出现,导致它"闪烁"或"弹出"。
我也遇到了在IE(我在v11上)中图像作为普通UL垂直平铺并且不动画的问题。
这是我在 HTML 中的滑块声明
<ul class="bxslider">
<li><img src="IMG" /></li>
<li><img src="IMG" /></li>
<li><img src="IMG" /></li>
<li><img src="IMG" /></li>
</ul>
<script>
$(document).ready(function(){
$('.bxslider').bxSlider({
mode: 'fade',
speed: 500
});
});
</script>
这是我的样式表声明的全部内容。
<!-- Stylesheets -->
<link rel="stylesheet" href="css/style.css" media="all">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="js/plugins/jquery.easing.1.3.js"></script>
<script src="js/jquery.bxslider.js"></script>
<link href="js/jquery.bxslider.css" rel="stylesheet" />
<link rel="stylesheet" href="rmm-css/responsivemobilemenu.css" type="text/css"/>
<script type="text/javascript" src="rmm-js/responsivemobilemenu.js"></script>
<link rel="stylesheet" href="css/slider.css" media="all">
<link rel="stylesheet" href="css/col.css" media="all">
<link rel="stylesheet" href="css/2cols.css" media="all">
<link rel="stylesheet" href="css/3cols.css" media="all">
<link rel="stylesheet" href="css/4cols.css" media="all">
<link rel="stylesheet" href="css/5cols.css" media="all">
<link rel="stylesheet" href="css/6cols.css" media="all">
<link rel="stylesheet" href="css/7cols.css" media="all">
<link rel="stylesheet" href="css/8cols.css" media="all">
<link rel="stylesheet" href="css/9cols.css" media="all">
<link rel="stylesheet" href="css/10cols.css" media="all">
<link rel="stylesheet" href="css/11cols.css" media="all">
<link rel="stylesheet" href="css/12cols.css" media="all">
几天来我一直在尝试启动并运行某种响应式滑块,请帮忙。
建议其他滑块或方法也可以帮助解决我的问题,请注意,我对jquery或javascript一无所知。
,淡入/淡出具有"暂停":4000和"速度":500,将"速度"设置为2000(毫秒)将具有fadeIn性能良好。
我遇到了同样的问题,发现我不小心在同一组图像上声明了两个 bxSlider 实例。我重做了我的js代码以删除其中一个,问题已解决。