How can I alter anythingSlider so that it disables the next / previous buttons when only 1 <li> in the <ul>?
I have a page with multiple instances of anythingSlider on it and I'm using PHP to dynamically load pages that swap out the content in them.
Reference: http://ceedcreative.com/CEED_2.0/
I would like to edit the anythingSlider to disable the previous / next buttons if the UL it's displaying only has one LI within it.
In other words, no buttons, jus开发者_JAVA百科t a clean div that's the same heigh and width (no scrolling) if there's only one image.
Try this
$('.anythingSlider:not("#topSlider")').each(function(i, slider) {
// If any slider has less than 2 let members
if ( $("ul li", slider).length < 2 ) {
// don't apply the slider functionality
return;
}
$(slider).anythingSlider({
easing: "easeInOutExpo",
autoPlay: false,
delay: 3000,
startStopped: false,
animationTime: 600,
hashTags: false,
buildNextPrevButtons: true,
buildNavigation: false
});
});
If, for some reason, that doesn't work, this snippet will inspect the list length of every anythingSlider and hide the arrow buttons for any list that is only 1 in length (after excluding the front and back clones).
$(".anythingSlider").each(function(i, slider) {
if ( $("ul li", slider).not(".cloned").length == 1 ) {
$(".arrow", slider).hide();
}
});
精彩评论