Question

我正在使用Basic jQuery Slider（http://www.basic-slider.com）。我正在我的页面上获取滑块，它工作正常。但现在我想使用next / prev图像（＆lt;，＆gt;）进行按钮控制。我试图禁用next / prev文本，但它在控件部分显示“undefined”。如何用Image更改控件？我提供的html和css代码。对于JS文件，我正在上传它并分享链接。任何人都知道解决方案请帮助。提前完成。

js链接 https://www.dropbox.com/s/6ab23bbe3r1lixh/bjqs-1.3.min.js?dl=0

滑块的HTML代码

<div class="slider">
    <ul class="bjqs">
       <li><img src="<?php echo bloginfo('template_url');?>/images/banner01.jpg" width="100%" height="386px"></li>
       <li><img src="<?php echo bloginfo('template_url');?>/images/banner02.jpg" width="100%" height="386px"></li>
       <li><img src="<?php echo bloginfo('template_url');?>/images/banner03.jpg" width="100%" height="386px"></li>
   </ul>
</div>

css文件

/* Basic jQuery Slider styles */

.slider img { display:block; }
.slider { margin:0 auto; width: 100%; box-shadow: 0px 50px 0px #0F0;}

ul.bjqs
{
position:relative;
list-style-type:none; 
padding:0;
margin:0;
overflow:hidden;
display:none;
}

li.bjqs-slide
{
position:absolute; 
display:none;
}

ul.bjqs-controls
{
list-style:none;
margin:0;
padding:0;
z-index:9999;
}

ul.bjqs-controls.v-centered li a{position:absolute;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0;}
ol.bjqs-markers{list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}
p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}

.bjqs-markers{ display:none; }

ul.bjqs-controls.v-centered li a{
display:block;
padding:10px;
background:#fff;
color:#000;
text-decoration: none;
}

ul.bjqs-controls.v-centered li a:hover{
background:#000;
color:#fff;
}

Answer 1

http://www.basic-slider.com链接无效。我创建了一个滑块。请检查。

[Slider Plunker] [1]

  [1]: https://plnkr.co/edit/iTq8urcfpB9cBp2onuWT?p=preview

jQuery Basic Slider - 使用按钮控件更改next / prev文本控件

1 个答案: