Skip navigation
Currently Being Moderated

jquery slider effect to fade

Jan 24, 2013 4:10 AM

Hi,

 

Could someone help me with my problem:

I have a site that I made using a Business Catalyst template called Adora, and there is a slidehow called AnythingSlider. The slider has a Swing effect that swings pictures and I would  like to change that into Fade effect.

 

Now I have no knowledge of jquery. Script on the Template looks like this:

 

<script type="text/javascript" src="/js/jquery.anythingslider.js"></script>

        <script type="text/javascript">

                                                  $(function(){

                                                            $('#slider1').anythingSlider({

                                                                      startStopped    : false, // If autoPlay is on, this can force it to start stopped

                                                                      hashTags        : false,

                                                                      toggleArrows    : false,

                                                                      buildArrows     : false,

                                                                      enablePlay      : true,      // if false, the play/stop button will still be visible, but not clickable.

                                                                      autoPlayLocked  : false,  // If true, user changing slides will not stop the slideshow

                                                                      resumeDelay     : 10000, // Resume slideshow after user interaction, only if autoplayLocked is true (in milliseconds).

                                                                      easing          : "swing",   // Anything other than "linear" or "swing" requires the easing plugin

                                                                      delay           : 4000,      // How long between slideshow transitions in AutoPlay mode (in milliseconds)

                                                                      animationTime   : 900,       // How long the slideshow transition takes (in milliseconds)

                                                                      onSlideComplete : function(slider){

                                                                                // alert('Welcome to Slide #' + slider.currentPage);

                                                                      }

                                                            });

                                                  });

            </script>

 

It says there: Anything other than "linear" or "swing" requires the easing plugin,

and I have found several different plugins, copyed the js file to my site, linked it to my Template file

(<script type="text/javascript" src="/js/jquery.easing.js"></script>,)

changed the easing "swing" to whatever I have found in the plugin js file, like "easeOutQuad".

But I cannot get it to work. Could anyone help me out here and tell me what am I doing wrong?

 

Thanks in advange!

 
Replies
  • Currently Being Moderated
    Jan 24, 2013 6:07 AM   in reply to Elisa WD

    I don't know this particular jQuery slide show but there's literally dozens of them out there.

     

    If you get stuck just do a search on Google. If its just a simple fade effect you need then maybe this one:

     

    http://jquery.malsup.com/cycle/

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 24, 2013 10:01 AM   in reply to Elisa WD

    Change this:

     

    easing          : "swing",   //

     

    to this:

     

    easing          : "linear",   //

     

     

    Save file & upload to server.  That may be all you need. 

     

    If you want to use other easing effects, you'll need to refer to the easing.js documentation.

    http://gsgd.co.uk/sandbox/jquery/easing/

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 25, 2013 9:54 AM   in reply to Elisa WD

    How about showing us a link to your page?

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 28, 2013 10:23 AM   in reply to Elisa WD

    I recommend you read the documentation for your plugin

    http://css-tricks.com/anythingslider-jquery-plugin/

     

     

    Nancy O.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points