How to remove buttons in AnythingSlider and stop the sliding?

Question

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 *li*s 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.

Answer 1

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);