How to remove buttons in AnythingSlider and stop the sliding?
I'm currently using the anythingSlider it works quite well.
But if there is one li, how do i make it stop sliding and remove the buttons displayed below?
The lis are generated from the database so sometimes there's only one. I want the buttons to show only when there is more then one image.
if there is one image all the buttons( back, forward, pause) should not be displayed.
Does anybody know of a way of stopping it sliding if there's only one li and removing the buttons when there is only one image.
==============================================================开发者_开发知识库=======================
Thank You. Currently I have the working version, posted below the old code is working. I tried to replace it with yours it didnt seem to work. Is there something else that needs to be added?
function formatText(index, panel) { return index + ""; } $(function () { $('.anythingSlider').anythingSlider({ easing: "easeInOutExpo", // Anything other than "linear" or "swing" requires the easing plugin autoPlay: true, // This turns off the entire FUNCTIONALY, not just if it starts running or not. delay: 7500, // How long between slide transitions in AutoPlay mode startStopped: false, // If autoPlay is on, this can force it to start stopped animationTime: 1250, // How long the slide transition takes hashTags: true, // Should links change the hashtag in the URL? buildNavigation: true, // If true, builds and list of anchor links to link to each slide pauseOnHover: true, // If true, and autoPlay is enabled, the show will pause on hover startText: "", // Start text stopText: "", // Start text navigationFormatter: formatText // Details at the top of the file on this use (advanced use) }); $("#slide-jump").click(function(){ $('.anythingSlider').anythingSlider(6); }); }); UPDATED WITH YOUR CODE : function formatText(index, panel) { return index + ""; } $(function () { var singleSlide = true, options = { autoPlay: false, // This turns off the entire FUNCTIONALY, not just if it starts running or not. buildNavigation: false, // If true, builds and list of anchor links to link to each slide easing: "easeInOutExpo", // Anything other than "linear" or "swing" requires the easing plugin delay: 3000, // How long between slide transitions in AutoPlay mode animationTime: 600, // How long the slide transition takes hashTags: true, // Should links change the hashtag in the URL? pauseOnHover: true, // If true, and autoPlay is enabled, the show will pause on hover navigationFormatter: formatText // Details at the top of the file on this use (advanced use) }; // Add player options if more than one slide exists if ( $('.anythingSlider > div > ul > li').length > 1 ) { $.extend(options, { autoPlay: true, startStopped: false, // If autoPlay is on, this can force it to start stopped startText: "", // Start text stopText: "", // Start text buildNavigation: true }); singleSlide = false; } // Initiate anythingSlider $("#slide-jump").click(function(){ $('.anythingSlider').anythingSlider(6); }); // hide anythingSlider navigation arrows if (singleSlide) { $('.anythingSlider a.arrow').hide(); } }); HTML TAGS
========================================================================================= Update May 25 ,2010
When using
$('.anythingSlider').anythingSlider(options);
instead of
$('.anythingSlider').anythingSlider(6);
the slider runs but I noticed that I get a Javascript Error :Object required is there anything else I need to pass? Since before anythingSlider was taking 6 instead of options, where do I pass that 6, since its looking for it.
Try this script. It should be added after any script (Ajax?) that loads your slider content.
$(function () {
var singleSlide = true,
options = {
autoPlay: false, // This turns off the entire FUNCTIONALY, not just if it starts running or not.
buildNavigation: false, // If true, builds and list of anchor links to link to each slide
easing: "easeInOutExpo", // Anything other than "linear" or "swing" requires the easing plugin
delay: 3000, // How long between slide transitions in AutoPlay mode
animationTime: 600, // How long the slide transition takes
hashTags: true, // Should links change the hashtag in the URL?
pauseOnHover: true, // If true, and autoPlay is enabled, the show will pause on hover
navigationFormatter: formatText // Details at the top of the file on this use (advanced use)
};
// Add player options if more than one slide exists
if ( $('.anythingSlider > div > ul > li').length > 1 ) {
$.extend(options, {
autoPlay: true,
startStopped: false, // If autoPlay is on, this can force it to start stopped
startText: "Go", // Start text
stopText: "Stop", // Stop text
buildNavigation: true
});
singleSlide = false;
}
// Initiate anythingSlider
$('.anythingSlider').anythingSlider(options);
// hide anythingSlider navigation arrows
if (singleSlide) { $('.anythingSlider a.arrow').hide(); }
});
Personally, I think this should be built into the script...
Update:
Using the $('.anythingSlider').anythingSlider(6);
format was intented for external links. I think the only way you could get that error is if you call that function before setting up the anythingSlider.
An alternative, which I don't think would make a difference, would be to call the slider change like this: $('.anythingSlider').data('AnythingSlider').gotoPage(6);
精彩评论