我为滑块编写了以下脚本,但代码无法正常工作
由于我已初始化k = 5
,因此必须满足if条件并进入if部分
但它不起作用。
它都没有进入else
部分
如果我初始化k = 9
如果部分被执行,只有上面的行
任何人都可以告诉我们这个问题
(slick.js是我为我的滑块下载的一个插件。)
<!DOCTYPE html>
<html>
<head>
<style>
.demo{/*width:700px;height:207px;*/display:block;position:relative;border-style:solid;border-color:grey;/*margin-right:200px;*/min-width:240px;}
.demo img{width:75px;height:75px;}
</style>
<link rel="stylesheet" type="text/css" href="slick.css"/>
<script type="text/javascript" src="jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="slick.js"></script>
<script type="text/javascript">
var k = 8, t = 1;
$(document).ready(
function () {
$('.demo').slick({
dots: false,
infinite: false,
draggable: true, // Enables mouse drag
arrows: true,
speed: 200,
slidesToScroll: 1
});
if (k < 7) {
$('.demo').slick({
responsive: [
{
breakpoint: 1024,
settings: {
draggable: true,
speed: 200,
slidesToShow: k,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
}
]
});
if (k < 5) {
$('.demo').slick({
responsive: [
{
breakpoint: 600,
settings: {
draggable: true,
speed: 200,
slidesToShow: k,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
}
]
});
if (k < 3) {
$('.demo').slick({
responsive: [
{
breakpoint: 450,
settings: {
draggable: true,
speed: 200,
slidesToShow: k,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
}
]
});
}
}
}
else {
$('.demo').slick({
responsive: [
{
breakpoint: 1024,
settings: {
draggable: true,
speed: 200,
slidesToShow: 7,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
},
{
breakpoint: 600,
settings: {
draggable: true,
speed: 200,
slidesToShow: 5,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
},
{
breakpoint: 480,
settings: {
draggable: true,
speed: 200,
slidesToShow: 3,
slidesToScroll: 1,
infinite: false,
arrows: true,
dots: false
}
}
]
});
}
});
</script>
</head>
<body>
<div class="demo">
<div><img class="ig" src="1.jpg"></div>
<div><img class="ig" src="2.jpg"></div>
<div><img class="ig" src="3.jpg"></div>
<div><img class="ig" src="4.jpg"></div>
<div><img class="ig" src="5.jpg"></div>
<div><img class="ig" src="6.jpg"></div>
<div><img class="ig" src="7.jpg"></div>
<div><img class="ig" src="8.gif"></div>
</div>
</body>
</html>