bxslider

问题 I'm using the bx slider with 3 items in the viewport and I need it have a css class for the active list item (in this case the middle child) but it isn't working. Here's the HTML and javascript: <ul class="bxslider" id="slider1"> <li><img src="img/img-a.png" /> </li> <li><img src="img/img-b.png" /> </li> <li><img src="img/img-c.png" /> </li> </ul> <script type="text/javascript"> $(document).ready(function(){ $('.bxslider').bxSlider(); }); </script> <script type="text/javascript">

问题 BX-Slider active class not working when using with pagerCustom. Pager is also slider with active class which is with red border. Any idea how to fix it? Html: <ul class="bxslider"> <li><img src="http://bxslider.com/images/730_200/hill_trees.jpg" /></li> <li><img src="http://bxslider.com/images/730_200/me_trees.jpg" /></li> <li><img src="http://bxslider.com/images/730_200/houses.jpg" /></li> <li><img src="http://bxslider.com/images/730_200/tree_root.jpg" /></li> <li><img src="http://bxslider

问题 This question has already been asked, but has no answer - I believe because not enough information was provided. I am using the bxslider as my template. See here: http://bxslider.com/examples/image-slideshow-captions I can create a very simply caption using the "title" attribute, but I want to be able to create subtitles (with different attributes like smaller text) and I want to turn this into a link. I've tried implementing a div within the container, and perhaps obviously, I can't get that

问题 I know I can set the speed of the transition (with speed ). But is there any option to set the duration a slide is shown until the transition to the next slide begins? 回答1: Using the pause option: $('.bxslider').bxSlider({ pause: 3000 }); Example: http://jsfiddle.net/Yq3RM/202/ Update Another example that modifies the pause for each image. bxSlider doesn't have a nice built in way to do this that I am aware of, however I was able to pull it off in the following way: var ImagePauses = [1000

问题 i have a problem with bxslider carousel. im trying to make responsive web and im using resize method in js. im trying to make slider has 2 slides and then 1 slide by shrinking window width. But,,,, when i shrink window width, bxslider is not changing..... below is my code. i searched a lot about this problem,, ppl ask to put reloadSlider or destroySlider but i dnt know where exactly put in this code,, var slider; function bxslider(){ if(width>555&&width<=765){ slider=$('.bxslider2').bxSlider(

问题 I am new in bootstrap and web design .i want to create a slider with mobile responsive in which i want to align the text in box at middle of slider and also it happen in responsive as well. so help me to solve. How can i make responsive ?? i made align center in desktop view but in mobile view or responsive it won't happen. Please Note: i am using bx slider here. (screenshot attached) Here is my code: <header> <div class="slider"> <ul class="bxslider"> <li><img src="images/slider.jpg" class=

问题 I am using bxslider with a thumbnail pager. It all works fine, but there is a large space between the slides and the thumbnails (about an inch). I can't find where to reduce the size of this gap. Here's my code <div style="width:720px;margin:0 auto;"> <div class="bxslider"> <div style="background-image:url('images/slide14.png');width:710px;height:230px">number 1</div> <div style="background-image:url('images/slide16.png');width:710px;height:230px">number 2</div> <div style="background-image

问题 I am using Bxslider on a tabbed gallery with thumbnails and it works great. the arrows and the tabs are working perfectly. this is the JS I am using: jQuery('#learni-features .bxslider').bxSlider({ mode: 'fade', useCSS: false, moveSlides: 1, pagerCustom: '.tabs-links' }); and this is the HTML: this is for the tabs: <ul class="tabs-links"> <li class="active"><a href="" data-slide-index="0">Curriculum <br>Control</a></li> <li><a href="" data-slide-index="1">Interactive <br>Classes</a></li> <li>

问题 I am trying to launch a pop up div which will contain a bx slider. The link that launches the pop up div works fine. So is the pop up which appears with some text but the images inside the bxslider don't appear. I thought it was a z-index issue but seems not (or did not manage to fix it indeed). The loading and direction control images are there but not the images.. Many thanks for your help ! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD

问题 I am working on a full screen content bx-slider which is mix of text and images inside the slides with 100% height but somehow i dont know what is the problem its facing on resize. I am using this code:- $(function() { var eleSlider = $('.main-slider'); var callSlider = eleSlider.bxSlider({ //pagerCustom: '.bx-pager', adaptiveHeight: true, adaptiveHeightSpeed: 1000, //mode: 'slide', //useCSS: false, infiniteLoop: false, hideControlOnEnd:true, easing: 'easeInOutExpo', //video: true, speed: