Change log

Rob Garrison edited this page Dec 1, 2017 · 35 revisions

Version 1.9.7 (12/1/2017)

  • Core: Prevent JS error when panel doesn't exist. Fixes issue #659.

Version 1.9.6 (5/25/2016)

  • Video: Use https for YouTube api calls. Fixes issue #648.
  • Demos: Use https for external files. Fixes issue #646.

Version 1.9.5 (3/4/2016)

  • Dynamic video extension
    • Prevent reinitializing the video more than once.
    • Allow dynamically adding & removing videos; call .anythingSliderVideo() to update.
    • Add dynamic demo to video page.
    • All thanks to christian-seifert in pull #604!
  • Force vimeo iframe to use https to prevent iframe communication issues. Fixes issue #645.

Version 1.9.4 (11/15/2013)

  • Added aspectRatio so that the slider scales according to this ratio when the expand option is given. Thanks npn66nicke!

Version 1.9.3

  • Updated all css themes (added s to css3 transition duration) so it will pass css3 validation. Fixes issue #556.
  • Fade mode with resumeOnVisible set to true will now set the panel visibility to hidden when it is not the current panel. Fixes issue #559.
  • Added a method to customize the toggleControls to only hide/show the arrows while the slide show is playing.
    • To toggle both the navigation arrows and controls, set the toggleControls option is true.
    • To toggle only the navigation arrows, but not the controls, set the toggleControls option to anything other than false - use "true" (or any string within the quotes).
    • This fulfills the enhancement request from issue #560.
  • Added a component.json file to allow registering this plugin with bower. Fulfills issue #566.

Version 1.9.2

  • Fixed video extension to now properly work with multiple sliders. See issue #548.

Version 1.9.1

  • Added onVideoInitialized callback to the video extension.
    • This callback function is called after the video extension has initialized.

      onVideoInitialized: function(slider){ }
    • The function is passed a base (aka slider) parameter which can also be obtained using $('#slider').data('AnythingSlider').

    • All video functions are contained in and video options are contained within

  • Added onSliderResize callback & slideshow_resized event.
    • This callback function is called whenever the slider resizes.

    • The function/event is passed an event object and base parameter.

      onSliderResize: function(event, slider){ }
    • Thanks to wearetelescopic for sharing.

Version 1.9.0

  • Core updates:

    • Support for jQuery's addBack and/or andSelf applied; see issue #508.
    • The playRtl option no longer swaps direction of the arrows; see issue #526.
    • The combination of stopAtEnd:true, infiniteSlides:false and showMultiple > 1, no longer shows empty panels. Fixes issue #515.
    • Deprecated the addWmodeToObject option. Replaced by video extension's wmode option; see below for more details.
  • AnythingSlider Video Extension updates:

    • Sadly, I didn't have time to completely rewrite this extension, but I think I got everything working properly again.

    • Also, I didn't get a chance to do extensive video testing in IE, Safari or Opera... and since the newest Safari will no longer be available for Windows, I'll need some feedback on how it's working in that browser.

    • The video extension no longer "automatically loads" itself

      • You will now need to initialize this extension along with AnythingSlider (defaults shown below):

            // video id prefix; suffix from $.fn.anythingSliderVideo.videoIndex
            videoId         : 'asvideo',
            // auto load YouTube api script
            youtubeAutoLoad : true,
            // YouTube iframe parameters, for a full list see:
            youtubeParams   : {
              modestbranding : 1,
              iv_load_policy : 3,
              fs : 1,
              wmode: 'opaque' // this is set by the wmode option above, so no need to include it here
      • This fixes issue #167.

    • YouTube:

      • YouTube video should now properly pause and resume as it now dynamically loads the YouTube iframe api (set youtubeAutoLoad option to false to disable). Fixes issues #191, #263 & #333.
      • Add any YouTube iframe parameters within the video extension options, as seen above.
        • Also, go here for a full list of iframe parameters.
        • This will allow you to hide video controls (controls: 0) - see issue #501.
        • Autoplaying videos (autoplay: 1) will still be problematic, for these reasons:
          • If multiple videos exists in the slider, they will all start autoplaying at once.
          • If there is a single video and it isn't in the starting panel, it will start playing in the background.
          • Autoplaying won't work in some mobile browsers like Chrome or Safari (ref) - see issue #454.
      • The YouTube iframe wmode parameter is automatically set by the AnythingSlider addWmodeToObject option.
      • YouTube embedded video still requires swfobject, but does not use the above youtubeParams option.
    • HTML5 video now recognizes the resumeOnVisible option properly. See issue #525.

    • The videoId option automatically adds an ID to each video; this option contains the id prefix. The suffix is now properly added so having multiple video initialization blocks will no longer repeat the same Id.

    • Changed the video extension to only use a GPL license, to match the main plugin.

Version 1.8.18

  • Modified vertical mode to now work with showMultiple and show multiple slides.
    • When showing more panels vertically, the plugin keeps the set panel size and just adds it to the bottom. So, if you set the slider to 300x200 and show two panels vertically, it will end up being 400 pixels in height, plus a bit more for the navigation. The plugin did the same with width, so it's just following this pattern.
    • When using vertical mode and expand is true, the panels will be forced to fit within the height contraints, so the above pattern is not followed.
    • If resizeContents is false the panels will be left aligned, and the slider will resize it's width and height to match the biggest panel.
    • This feature request fulfills issue #378.
    • This feature has not been rigourously tested with all different combinations, so if you find any problems please report them by opening up an issue.

Version 1.8.17

  • Minified version updated, as it was still an older version.

Version 1.8.16

  • Merged in video extension update to prevent errors in iOS devices that don't support Flash. See pull #485. Thanks mlms13!

Version 1.8.15

  • Another version bump to try to register the plugin.

Version 1.8.14

  • Modified expand:
  • It now delays checking when the document is hidden.
  • Updated resizing checks to hopefully fix issue #481.
  • Updated cs-portfolio theme to include a bottom margin so the controls don't get overlapped. See issue #483.
  • Updated demos:
  • Demos now use jQuery 1.8. I was going to update the demos to use v1.9, but it's still very buggy. The biggest one being this animation issue which has been fixed in v1.9.1.
  • Because I will eventually update the demos to use jQuery v2.0, I had to switch the syntax-highlighting plugin to use google's prettify.
  • Updated colorbox plugin also because of errors when testing demos with jQuery v2.0.
  • Updated included jQuery file to v1.8.3.
  • Moved change log from the index.html file back to the file... it makes it easier to copy the markdown directly into the wiki change log.

Versions 1.8.10 to 1.8.13

Version 1.8.9

  • Removed code that clears the height of the outer wrapper when using the expand option. Fixes issue #476.

Version 1.8.8

  • More hashTag option tweaks:
    • The current panel can no longer be set via the hash when the hashTags option is set to false.
    • This prevents errors when using other history plugins. Fixes issue #432.

Version 1.8.7

  • Fixed hash tag issues.
    • Equals within the hash should now be ignored. Fixes issue #413.
    • Hashtags are no longer processed if the hashTags option is false. Fixes issue #432.
  • Updated all themes to no longer use a negative z-index. Fixes issue #447.
  • Updating a slider will now include updating the width and height of the slider. Fixes issue #459.
  • Slideshow now stops/pauses when the slider is not in the active browser tab.
    • The slideshow completely stops if not in the active browser tab.
    • If the autoPlayLocked option is true, the slideshow will only pause, then resume once the browser tab is active.
    • Enhancement request from issue #463.

Moved Repo!

  • The AnythingSlider repo was "moved" from ProLoser/AnythingSlider to CSS-Tricks/AnythingSlider.
  • Due to an issue, the repository was removed and all issues and links were lost, sorry for the inconvenience.
  • The Wiki documents have been replaced, but as all of the jsFiddle demos were targetting the files from the previous location, they are most likely all broken. I will slowly update these demos and links as time permits.

Version 1.8.6

  • Animation time can now be set to zero when using the API method.
  • Fixed IE9 flashing in fade mode. Fix for issue #377.
  • Modified fade mode to use the resumeOnVisible option:
    • If the option is true, non-current panels will have an opacity of zero and be hidden by having a lower z-index.
    • If resumeOnVisible is false all non-current panels will be hidden. But because they are hidden (display:none), all videos will restart when they become visible again and there is no way to control it.
    • Hopefully setting the option to false will fix the issues that mobile devices are having with video.
  • Fade mode no longer uses css to set the opacity. Hopefully this will fix issue #379.
  • Updated the wiki documentation to include API functions.

Version 1.8.5

  • Added a new option named allowRapidChange.
    • When false, the default setting, the slider will ignore attempts to rapidly change the current slide, using the methods or keyboard arrow keys.
    • If true, the plugin will allow the user to rapidly click on the navigation tabs or arrows to skip slides quickly. The animation will jump to the end, so it may not appear as smooth when this option is false.
  • When using fade mode, the links in the first panel will now work properly. Fixes issue #346.
  • When showMultiple and changeBy are more than one, and infiniteSlides is false, the slider will now properly show all of the slides. Fixes issue #356. Thanks to NewMediaRoc for sharing the code!

Version 1.8.4

  • The anythingControls div will no longer be added to the markup when empty. Fixes issue #342.
  • Fixed error that occurs when buildArrows is false and stopAtEnd is true. Fix for issue #343. Thanks to lhwparis for the code!

Version 1.8.3

  • Fixed fade mode animation bug. It should now behave as the other modes in that rapid panel changes are ignored. Fixes issue #340 (and maybe issues #338 & #339?).

Version 1.8.2

  • Fixed autoPlay option. Fix for issue #331.
  • Removed IE conditional comments from demo files.

Version 1.8.1

  • Nested sliders will no longer bubble the slideComplete event. Fix for issue #328.
  • Added an additional comment or two to the css/less.
  • Removed an unused css class name definition.

Version 1.8

  • Current navigation tab now updates before the slider animation.
  • Added mode option:
    • Options include: "horizontal", "vertical" and "fade".
    • When set to "horizontal" (or just "h") the slider will behave as normally, sliding left and right.
    • When set to "vertical" (or just "v") the slider will slide panels vertically. This option replaces the vertical option.
    • With this option set to "fade" (or just "f"), the slider will cross-fade from the current image to the next. When the slider is in "fade" mode, it will override the infiniteSlides and showMultiple options.
    • Updated the second main demo to use the new cross-fade mode.
    • This option was inspired by Jamy Golden's PlusSlider.
  • Added anythingSlider-hovered class which is applied to the outer wrapper when the slider is being hovered over - in case you want to apply some css3 animations.
  • Modified the css:
    • Css styling has been split up for default and active navigation tabs to allow better understanding of how it is set up. Fix for issue #308.
    • Each css file is now completely independent, i.e. there is no need to load anythingslider.css when using an additional theme file.
    • Added an internal method that adds a class name of as-oldie to the document body if the browser is IE8 or older - this method uses injected conditional comments.
    • Removed the anythingslider-ie.css and moved the necessary css into each theme file, prefixed with .as-oldie.
    • Added LESS files of each theme in a subfolder in the css folder. I'm still learning LESS, so it may not be optimal, so any suggestions would be appreciated.
    • Modified the construction.gif image and arrow css to allow changing the height of the construction navigation arrows to any value between 1 and 300.
  • Fixed an issue with the tooltipClass not being applied if you use the navigationFormatter. Fix mentions in issue #1 of my tooltip plugin (Jatt).
  • Fixed an issue with toggleArrows: true and expand: true causing flickering on resize. Fix for issue #317.
  • Fixed an issue with the tooltip class was always being added. The title attribute was not added at all.
  • Fixed an issue with an ID in the hash not triggering the positioning of the proper slide.
  • Fixed errors that occurred when initializing an empty slider. Fix for issue #95.
  • Fixed arrows appended outside of the slider not getting the "disabled" class. Fix for issue #315.
  • Fixed an issue with the incorrect width being set on the wrapper when showMultiple is greater than one and resizeContents is false with slides of varying width.
  • Modified hash indexing of the sliders. You shouldn't notice a difference unless you have multiple sliders on a page and initialized them in an order other than from top to bottom.
  • Modified positioning of the start-stop button so it is now appended to the end of the anythingControls div instead of at the beginning.

Version 1.7.27

  • Fixed a bug that previously would show the slide before the desired one, if the window location hash was targeting an ID in the slider and infiniteSlides was set to false.

Version 1.7.26

  • Modified the navigationFormatter option to now allow applying attributes directly to the tab as well as modifying the contents. Please refer to the documentation for more details.
  • The tooltipClass option now applies the tooltip class to the navigation tab (LI) automatically instead of checking to see if the text is hidden. In order to modify the tab title, you'll need to use the new navigationFormatter method.

Version 1.7.25

  • When hashTags is true, the browser hash will now update when clicking on the slider arrows as well as navigation buttons.
  • Yet another fix for the $targetPage callback variable.
  • When a hash tag sets the slider position, the $lastPage and $targetPage callback variables are now set properly during the onInitialized event.
  • When resizeContents is false, the outer wrapper will no longer animate a resize if there is no change in dimensions. Fix for issue #264.
  • Webkit browsers should now resize the outer wrapper properly when the slide is set by the hash.

Version 1.7.24

  • The toggleArrows option now accounts for arrows that don't have an absolute position, left or right, set to zero. Thanks to Krinkle for bringing up issue #260 and sharing a fix.

Version 1.7.23

  • Fixed $targetPage callback parameter to actually point to the right page. Continuation of issue #233.

Version 1.7.22

  • Fixed the navigation tooltips, apparently it's been broken this entire time... Updated the first slider on the main demo page to show navigation tooltips.

Version 1.7.21

  • Removed max-width: 32766px from the css as the latest version of Opera (11.60+) no longer appears to have this limitation - YAY!
  • AnythingSlider can now use the animate.css library!
    • Updated the FX extension to also add "animate.css" css3 animations to panels.
    • Added CSS3 demo page to demonstrate this new functionality.
    • See the "animate.css" demo of all of the animations and get the latest version from
  • Commented out the appendForwardTo, appendBackTo, appendControlsTo, appendNavigationTo and appendStartStopTo options from the plugin to reduce the size of the minified version. These options were set to null as placeholders in the code. They should continue to function as before.
  • General code cleanup to reduce the size of the minified version.
  • Fixed an issue with the exactPage variable, utilized by the FX extension, as mentioned in issue #233.

Version 1.7.20

  • Fixed targetPage containing the incorrect page when infiniteSlides is false. Fix for issue #233.
  • Hopefully fixed the issue with IE8 and the navigation. Fix for issues #206 and #182.

Version 1.7.19

  • Added package.json file to register this plugin with the new jquery plugin page (in development).

Version 1.7.18

  • Another fix for issue #216. This time it ignores "#/" and "#!/" in the location hash.

Version 1.7.17

Version 1.7.16

  • Ok, I didn't like changing the video option as it was below, so I moved the option into the core plugin. The option is now called resumeOnVisible.


  • Fixed an issue in the video extension where watching a related YouTube video in the slider would cause javascript errors.

  • Added another known issue with the video extension - Watching a related video breaks the ability if the slider to continue playing and pause the slideshow while playing these videos. This is because the iframe does not update the video URL and there is no way, that I know of, of determining which iframe is reporting a status change.

  • Added a video option named resumeVideo which when false, does not continue playing a paused video. Change this option as follows (inside of a document ready call and before the slider is initialized):

    $.anythingSliderVideoDefaults.resumeVideo = false;

Version 1.7.15

  • Fixed an issue with calling the navigation window function which isn't initialized when the number of tabs shown equals the navigationSize value. Fix for issue #209.

Version 1.7.14

  • Attempted to fix an issue with adding slider content based on the error reported in issue #207.
  • Links in nested sliders should now work properly. Fix for issue #208.
  • Changed YouTube video status updating, to hopefully fix issue #191. But I noticed a few other problems in Safari, so I will address those soon.
  • Fixed a problem with setting the slider height if it was undefined, or set before the image completely loaded. This was introduced in v1.7.13.

Version 1.7.13

  • Updated the plugin so that if panel sizes aren't defined in the css, it will default to the slider size. This should fix the problem with the slider initializing with a zero width or height.

  • Added a "targetPage" callback variable which contains the targeted page number; "$targetPage" still contains the jQuery object of the targeted page. This can be used in event or callbacks:

    $('#slider').bind('slide_begin', function(event, slider){
      console.debug( 'The target page is #' + slider.targetPage );
      console.debug( 'The title of the target page is: ' + slider.$targetPage.find('h1').text() );
      // Do something else

    Note that the targetPage variable contains the correct page before the slider animates, whereas "slider.currentPage" contains the current slide and is not updated until after the animation completes. See the Callback Arguments section in the wiki documents for a full list.

Version 1.7.12

  • Clicking links inside of a slide when mulitple slides are showing will no longer change the slider. Fix for issue #187.
  • Updated how the navigation width was calculated when navigationSize is set so the new tabs-light and tabs-dark themes tab widths are calculated a bit more accurately - but it's still not perfect.


  • Updated the AnythingSlider css file to restore the overflow setting after the slider has initialized. Fix for issue #183. Thanks sawmac!
  • This fixes a problem created in the previous update.


  • Updated the AnythingSlider css file to include the flash of unstyled content (FOUC) method 1 from the FAQ page.


  • Updated the FX extension

    • When the animationTime is set to zero, the "fade" out effect occurred immediately. The fx extension has been updated to use the default time instead.
    • Updated the fade FX demo to use delayBeforeAnimate to allow the current image to fade out before transitioning.


  • Added a local copy of jQuery with fallback.


  • Fixed a problem with the "fade" fx. See issue #171.
    • In older versions, the size parameter was ignored; but with the changes in 1.7.11, it became required and now follows the same format as all of the other effects.

    • The value is actually an opacity to use and must be included if adding a time or easing effect.

      // '.selector' : [ 'fade', 'opacity', 'time', 'easing' ]
      // opacity number between 0 and 1 (default is 1, so using '' will set the value to 1)
      '.selector' : [ 'fade', '', 500, 'easeInOutCirc' ]

Version 1.7.11

  • Updated the FX extension:

    • Added grow option that allows for growing text - like in the movies! popcorn

    • Allow ability to set multiple sizes for the grow and expand fx by simply separating the two values with a comma. If only one value is present, the fx will use that value (left side of the comma) as described below.

      // '.selector' : [ 'effect(s)', 'distance/size', 'time', 'easing' ]
      '.selector' : [ 'grow', '24px, 80px' ]   // 'original text size, fx size'
      '.selector' : [ 'expand', '10%, 100%' ], // 'fx size, original size'
    • The difference between grow and expand is that grow changes the font size whereas expand changes the width and height.

    • Added ability to set the fade ending opacity.

      // '.selector' : [ 'effect(s)', 'distance/size', 'time', 'easing' ]
      '.selector' : [ 'fade', '0.8' ] // opacity number between 0 and 1
    • Changed the intro fx from being initialized immediately to occurring when the page has finished loading.

  • Fixed a problem that occurs when resizeContents is false and the slide content has padding and/or margins.

Version 1.7.10

  • Fixed a problem where setting the animationTime to zero would not trigger any callbacks, thus preventing the FX extension from working.

Version 1.7.9

  • Added vertical option

    • When true, all of the content in the slider will scroll vertically.
    • Included up & down keyboard keys to navigate, but only when the vertical option is true.
    • The showMultiple option does not currently work when the content is vertical. I may fix this in future versions.
    • Thanks to Caroline-Elisa for the suggestion - in issue #166.
  • AnythingSlider will now accept an ID or classname to target a specific panel in the slider. Callbacks can also be included. Here is an example:

    // original method
    // additional method
  • Updated FX extension

    • Fixed a problem with the "expand" effect in the FX extension where the height would not change in some browsers.
    • Added outFxBind and inFxBind options which set which AnythingSlider callbacks are used. This might be more useful if binding FX on slide begin so the element is already animating when the slide comes into view.

Version 1.7.8

  • Added delayBeforeAnimate option
    • This value is the amount of time to pause the slider before animating to the targeted slide.
    • Used if you want users to see the "out" effects applied by the FX extension.
    • Default value is zero.


  • Added stopRepeat option to the FX extension.
    • When true, the FX will not repeat when clicking on the current navigation tab.
    • When false (default setting), the FX will animate on any navigation tab.
    • Change the option as follows: $('#slider').anythingSlider(options).anythingSliderFx( effects, { stopRepeat: true });

Version 1.7.7

  • Fixed a problem where the slider would rewind if changeBy was a string.
  • Updated the FX extension
    • Fix problems with "bottom" and "right" effects not working.
    • The fx are now stored so they can be updated and/or modified dynamically.

Version 1.7.6

  • Modified the FX extension to trigger an intro effect which occurs immediately after the slider has initialized. Discussed in issue #130.
  • Modified the hash tag functionality
    • If the hash points to an ID that is inside the slider, that slide will now be visible on page load, this will work even without the hashTags option enabled. For example, the following link demos.html#quote2 will go to the FX demo page with the Quote#2 panel inside of Demo #2 in view and at the top of the page.
    • The ID hash will work when other panels are included in the hash (demos.html#quote2&panel3-3), but the page will not scroll that slider into view; the browser will not bring it into view because the hash is not an ID.
    • The "panelx-#" hash will override the above id hash, so this link demos.html#quote2&panel2-2 will show the first quote panel in demo 2, but the page will not scroll the slider into view.
  • Reversed the order that the arrows are appended so that the previous arrow is first in the HTML. Fix for issue #153.

Version 1.7.5

  • Added navigationSize option
    • See the second slider on the main demo page for an example
    • To enable, set this option to the desired number of visible navigation tabs.
    • Set to false when not enabled.
    • Forward and back arrows are set by the value of the backText and forwardText options (also used by the main arrows)
    • Updated CSS styling for all provided themes.
  • Fixed a problem that broke the slideshow auto play function when resumeOnVideoEnd is false.
  • Updated the FX extension:
    • Fixed a bug were the FX weren't applied to elements in the next slide. Fix for issue #147.
    • Removed all code that hid or made elements have visibility hidden; no longer needed because each panel has overflow hidden applied.
  • Modified theme images and stylesheets. Each theme now uses one image sprite. The construction theme navigation images were made smaller as well, but yeah, I know it's still fugly.
  • Removed backward compatibility to jQuery version 1.3.2, the oldest version now supported is 1.4.2. Ideally, use the latest version of jQuery because the known issues with jQuery versions older than 1.5 still exist.

Version 1.7.4

  • Fixed appendFowardTo to appendForwardTo. Thanks to Helmer!

Version 1.7.3

  • Reverted bring focused link into view code to fix issue #138.
  • Modified the above code to now work properly when showMultiple is greater than one.

Version 1.7.1

  • Fixed delay option being divided by two. Fix for issue #131.

Version 1.7

  • Removed width and height options. These are now set in the css. Enhancement suggested in issue #125.
  • Removed maxOverallWidth option.
    • This option was in place to ensure that the slider did not exceed Opera's 32766 pixel maximum width restriction.
    • Added .anythingBase { max-width: 32766px; } to the css.
  • Removed clickArrows and replaced it with clickForwardArrow & clickBackArrow to allow for jQuery Mobile users to add "swipeLeft" & "swipeRight".
  • Changed autoPlay:
    • Split autoPlay functionality, so that setting the new buildStartStop option to true will now build the start stop button.
    • Now, when autoPlay is true, the slideshow will now start automatically. Default set to false.
  • Added appendFowardTo & appendBackTo to indicate where to append the forward & back arrows. Enhancement suggested by issue #129.
  • Added appendNavigationTo & appendStartStopTo to indicate where to append the navigation tabs & start-stop button.
  • Added enableArrows option. When false, the arrows are visible, but not clickable.
  • Added enableStartStop option. When false, the start-stop button is visible, but not clickable.
  • Added autoPlayDelayed option. When true clicking to start the slide show will not immediately advance the slider. Enhancement suggested in issue #125.
  • Fixed autoPlayLocked true from starting the slideshow if the slideshow button is off (buildStartStop). Fix for issue #126.
  • Fixed Fx extension not completing the FX out animation when animationTime option is a very small number. Fix for issue #130.
  • Fixed running slideshow from making the slider active. It will still active when the user interacts with the slider.
  • Fixed video source tags - removed unnecessary closing slash.
  • Fixed a bug where multiple "activePage" classes were applied.

Version 1.6.2

  • Fixed broken callbacks. Introduced in version 1.6.1 - Oops!

Version 1.6.1

  • Added changeBy which sets how many panels to go forward or back by when the slideshow is active or when using the navigation arrows.
  • Rewrote the code that brings a focused link into view. This new code should be less problematic.

Version 1.6

  • Added the Video extension
    • Moved YouTube code from the AnythingSlider core into the extension, so you will need to load the extension to control videos now.
    • The video extension pauses videos and the slideshow as well as continues playing a video when it becomes visible.
    • Default video support includes YouTube iframe & embed, Vimeo iframe & embed and HTML5 video.
    • Added isVideoPlaying option which is used by the video extension to determine if a video is playing. If you don't use the video extension, you can add your own custom function here where returning true means the video is playing and returning false means the video is not playing.
    • Added "video.html" demo page.
    • Please review the compatibility table on the video.html page to see which browsers are fully supported.
  • Fixed the problem in IE7 where the an embeded video would not resize properly.
  • Fixed a problem with the plugin causing an error if the panel is empty or only contains a text node.

Version 1.5.21

  • Fixed $currentPage returning the incorrect page during the onSlideInit and onSlideBegin events.
  • Added $targetPage which provides the (non-cloned) destination page of the slider.

Version 1.5.20

  • Disabled focused links inside of a slider showing multiple slides, so now clicking on a link won't move the slider.

Version 1.5.19

  • Removed the themeDirectory option.

    • It is preferred that you add the theme stylesheet manually as described on the setup page.
    • This prevents the plugin from appending the stylesheet to the head of the document and overriding the IE stylesheet.
  • Changed the plugin so that an unordered list is no longer mandatory. The plugin will now look for the immediate children of the slider element. So this is now possible:

    <div id="slider">
      <div><!-- slide content --></div>
      <div><!-- slide content --></div>
      <div><!-- slide content --></div>
  • The method to initialize and control the slider hasn't changed.

Version 1.5.18

  • Fixed a problem with a javascript error occurring when only one slide is present and the width is set.
  • Added an internal variable "o" to replace "base.options" to reduce the code size by about 1k in both the regular and minified versions.

Version 1.5.17

  • Added an "Expand Demo" page because apparently the jsFiddle doesn't like to expand.
  • Modified a couple of selectors that are only available in jQuery 1.4+. So as before, if you need the plugin compatible with jQuery 1.3.2, all you need to do is un-comment out the code at the bottom of the "jquery.anythingslider.js" file.

Version 1.5.16

  • Added the expand option:
    • When true, the slider will expand to fit into the parent element.
    • This option allows you to apply a percentage width to the parent element for a fluid layout and have the slider resize automatically.
    • One example would be to have a div set to say "100%" browser width. The slider will expand to fit inside this div (width and height).
    • Please do not have the parent element of the slider be the body of the page. It won't break anything, but the height is difficult to determine since the body height measured doesn't include other elements on the page
    • There is a slight delay while resizing (500 millisecond) as the plugin resizes and repositions the panels. You'll just have to live with it :(
    • There is one bug in Opera where the height isn't set until the parent element is resized... I'll try to find it.
  • Also fixed the showMultiple code so that a width is no longer required if and only if all the panels are the same width. It simply divides the slider width by the number of slides to show... so you see why this may not work so well with different width panels.

Version 1.5.15

  • Fixed a problem in the code where startPage was used instead of startPanel - DUH.
  • Oh, and also made sure the script was getting a number instead of a string in the start panel option.

Version 1.5.14

  • Added showMultiple option - A enhancement proposed in issue #72.
    • When set to a number, AnythingSlider will show that number of slides within the view port.
    • When showing multiple slides, width of the slider MUST be included - well actually it is the width of one slide, so the plugin can figure out how big to make the view port.
    • The maximum number of slides showing is set to the number of slides.
    • If slides have different dimensions and resizeContents is set to false, the slider will resize to the height of the taller slide.
    • Updated the playground with this option. Check it this demo with two slides showing!
    • Thanks to caseybecking for the idea. And a ton more thanks to Poebel for sharing the code to do this.

Version 1.5.13

  • Fixed a bug where an empty UL would cause javascript errors - fix for issue #91.
  • Changed the panel positioning from using scrollLeft to left. This small change fixed a couple of problems including:
    • Print preview now shows the current panel without any additional css changes. The navigation arrows and tabs will need additonal print css styling.
    • Easing that required a negative margin using scrollLeft no longer needs any special handling - see issue #61.
    • A hidden AnythingSlider will now position properly. When attempting to set the panel with the slider hidden, scrollLeft would always return zero and not set properly. Updated Wiki FAQ with this information as well.

Version 1.5.12

  • Fixed a problem with the activePage class being added to the wrong page/panel when the infiniteSlides option is false.

Version 1.5.11

  • Updated all demos files to a HTML5 doctype with jQuery v1.6.
  • Removed print stylesheet.
  • Made file extension .html consistent.
  • Added "simple.html", which is the simplest possible demo so it is easier for people to build from.
  • Added a menu to each page for easier navigation to other demos and documentation.

Version 1.5.10

  • Fixed a bug that triggers the slideshow_stop event and onShowStop callback after each slide change. It now properly triggers after a running slideshow has stopped.
  • Changed code to completely remove the empty slides when infiniteSlides is false. It was code that was unnecessarily left in.
  • Changed code that replaced links in the cloned panels with code that disables the links - fix for issue #59.
  • Added a stylesheet to fix the theme problems in IE7 - fix for issue #71.
  • I'm not sure if this solution works for IE6.
  • One problem was that the navigation links have a negative text-indent. IE7 sends the entire link off-screen instead of just the text inside.
  • Fixed by wrapping all link text in a span and applying the negative text indent to the span instead of the link.
  • The second problem with the navigation arrows being cut off was due to the negative top marginl. So a separate conditionally loaded stylesheet was added with the top margin set to zero and a specific top percentage for each style.
  • Added width: 100% to the second slider's fourth panel instead of leaving the width/height undefined. In IE7, it would make the panel 20 pixels wide - fix for issue #73.
  • Fx Extension changes:
  • Fixed Fx Caption problem with FX not working when moving from first panel to last panel - fix for issue #75.
  • Fixed Fx caption to now show hidden ("display:none") captions. When clicking on the "x" in the caption, it was hiding the captions permanently, now it doesn't.
  • Changed FX Extension custom FX time to what it should have been, duration. To match the animation option.

Version 1.5.9

  • Silly bug fix that broke the navigation tabs - thanks to Hyland3r for pointing it out!

Version 1.5.8

  • Added a primitive print stylesheet. Optimized using Firefox & IE9 print preview. But when using IE9 compatibility modes, it works IE7, but not IE8 (entire slider is hidden).

  • Slider controls are now hidden in the css, to prevent the flash seen before a theme stylesheet is loaded. This can be prevented by added the theme stylesheet into the head of your document.

  • Changed theme stylesheet to be appended into the document head.

  • Fixed some of the theme stylesheets so the navigtion links now show in IE8, but still not in IE7 - see known issues above.

  • Fixed a problem where the active slider would move when using arrow keys inside a text area or input.

  • Fixed animating arrow opacity bug - fix for issue #60.

  • Fixed easing on the first slide. Fix for issue #61.

  • currentPage now shows the correct number during events. Fix for issue #69.

  • Fixed a minor problem with the FX extension fade. Regular base FX expect a size to be the second parameter, and since there is no size for 'fade' it now uses the second parameter for time. So, now this is possible:

      animationTime : 0
      '.panel' : [ 'fade', 1000, 'easeOutCirc' ] // target the entire panel

    The above code will fade out the current panel and fade in the next. But it does require some extra CSS to set the opacity of all panels to zero, otherwise the fading animation won't occur until the second time through the panels.

    <style type="text/css">
     #slider1 .panel { opacity: 0; }
     #slider1 .panel.activePage { opacity: 1; } /* make sure active panel is visible */

    It's not ideal, but it does make it possible to have a fade transition between slides, just not a crossfade transition.


  • Added a license.


  • Remove all ids in cloned panels - attempt to fix issue #59.


  • Adjusted some css to replace the bottom border in other themes when the slider is not at default size.
  • Adjusted Portfolio css theme to not hide the control bar.


  • Added css to fix RTL pages breaking the slider - fix for issue #57.
  • Added overflow:hidden to the anythingslider wrapper to prevent Opera and Safari from adding a horizontal scrollbar.

Version 1.5.7

  • Added infiniteSlidescode option. Fix for issue #58.
    • When true, the slider acts like an infinite slider.
    • When false, the slides stop at the first and last panel, even the slideshow.
    • The first and last panels are no longer cloned when this option is false. Blank panels were added in place.
    • When the slider is on the first or last panel, the slider will display a "rewind" effect if the stopAtEnd option is false.
    • When the slider is on the first or last panel and the stopAtEnd option is true, the back and forward arrow keys (respectively) will have a "disabled" class applied - modified in the css.
  • Replace appropriate code to make AnythingSlider backwards compatible with jQuery 1.3.2, but you'll need to uncomment out the portion at the end. You'll have to add it manually to the minified version. Sort of fix for issue #38.
  • Removed callback functions set to "null" in the default options to reduce the file size. The callbacks will still work.
  • Modified bits of the code to appease the JSLint gods.


  • Added overflow:hidden to each panel - fix for issue #51.
  • Added swf parameter to allow fullscreen videos - fix for issue #53.
  • Compressed callback function script.


  • Removed z-index from caption animation in the FX extension to fix an error it was causing in IE.


  • Added a callback (onSWFComplete) and triggered event (swf_completed) that is run when SWFObject completes its processing.
  • Rearranged the scripting in the index.html page so the "initialized" and "swf_completed" events now show up in the console log.


  • Fixed a problem with the toggleArrow functionality. It will now only animate the arrows when hovering over the Slide and not at all during the slideshow.
  • Added "first" and "last" classes to the navigation control <li>'s to allow for unique css styling.


  • Added a callback function to the external slider controller, so this is now possible:

    $('#slider').anythingSlider(4, function(slider){
     // "slider" is the same object used in the other callbacks and event triggers
     alert('Now on page ' + slider.currentPage);


  • Fixed a problem with the locked slide show - it should continue with all slides now after a user interacts with it.


  • Added resumeDelay option which is the amount of time (in milliseconds) that the slider delays until the slideshow is restarted - only active when autoPlayLocked is true.
  • Fixed the slide show stop button so now when it is pressed, the slideshow will now remain stopped. The slideshow will still resume if the user changes the current slide, but it will resume after the resumDelay time has passed.

Version 1.5.6

  • Added autoPlayLocked to prevent slideshow from stopping when a user changes the slide. The start/stop button still acts as expected.

Version 1.5.5

  • Modified base code to not resize all YouTube videos to 100% width and height. See the top slider panel #5 (Muppet video) for an example.


  • Changed the order in the index.html so the css is loaded before the javascript - possible fix for issue #34?

Version 1.5.4

  • Fixed "issue 32/33 - images wrapped in a link breaking the slider.

Version 1.5.3

  • Modified to not slide into the first slide on initializing
  • Removed some documentation from the README.textile and index.html files as they can now be found in these wiki pages.

Version 1.5.2

  • Fixed startStopped bug, where the slider stopped autoplaying on initialization.

Version 1.5.1

  • Added enableKeyboard option which will allow you to disable keyboard navigation controls. Added because if you have a slideshow with no clickable controls, using the keyboard will stop the slideshow and there is no way to start it back up.
  • Added enableNavigation option which, when false, will allow visible navigation links to be unclickable. You'll have to change the CSS to stop the hover effect.
  • Added enablePlay option which, when false, will allow a visible play/stop button to be unclickable. You'll have to change the CSS to stop the hover effect.
  • Fixed a problem with clicking control links inside a slider (links that take the slider to other panels). This also required that all links in the cloned panels are modified (changed into spans) - this will mess up any FX you add to these links but only in the first and last panels.
  • Added the following changes that Midu (Stefano B) made in his branch. Thanks for the great mods! I would have just merged your changes into the core, but I still suck at using git LOL :P
  • Added appendControlsTo which allows you to attach the slider controls (navigation tabs & play/stop button) to another object on the page. This wasn't throughly tested, but I know you'll need to include custom CSS to style these links outside the slider.
  • Added event hook & callback before_initialize (onBeforeInitialize) which is triggered immediately after the slider is initialized, see the note above for more details.
  • Added event hook & callback initialized (onInitialized) which is triggered after the AnythingSlider has completed its setup.
  • Optimized how callbacks functions are called - you shouldn't notice a difference.

Version 1.5

  • Modified core to allow updating the AnythingSlider content (change the number of slides).

Version 1.4.8

  • Added an optional extension "AnythingSlider FX" to add animation effects to each panel.
  • Added an AnythingSlider FX demo page with examples, code, and multiple methods to achieve the same effects. Thanks to Paal Joachim for input on which demos were needed.
  • Added activePage class to the visible slider; but it is not updated until just before the slide_complete event.
  • Fixed a bug where setting buildArrows to false and toggleArrows to true would cause errors.

Version 1.4.7

  • Added jQuery Objects for $currentPage and $lastPage which are accessible to the bind & callback functions for easy access to the pages. Added these callback arguments and more detail to the information above.
  • Improved the hash tag code so it will now work with multiple AnythingSliders on the page. The hash tag will still only update when clicking on the navigation links and not the navigation arrows.

Version 1.4.6

  • SWFObject script (swfobject.js) is now a required dependency to make YouTube videos pause when not in view & resume play when in view. This was added so IE will also have this functionality.
  • Commented out previous code which added the above YouTube functionality to non-IE browsers. Will consider completely removing it if users are okay with the SWFObject script dependency.

Version 1.4.5

  • Added Curtis Scott's Portfolio theme from his site. Thanks for sharing! - don't use the control toggle option as it messes up the page layout.
  • Fixed the flickering problem that was occuring when the slider moved from the last slide to the first.

Version 1.4.4

  • Added CSS to fix a problem with CSS3 transitions occurring during the animation. Added noTransitions class to the arrows, navigation and slider.
  • Added callback functions: onShowStart, onShowStop, onShowPause, onShowUnpause, onSlideInit, onSlideBegin & onSlideComplete.
  • Added instructions on callback argument useage as values and access to internal functions.
  • Changed triggered event callback argument to make using them easier - see the Event Hooks section above.

Version 1.4.3

  • Added options to modify interactivity: clickArrows, clickControls & clickSlideshow.
  • Added custom events - slideshow start, stop, pause & unpause as well as slide begin, start & stop. See the "Extending - Event Hooks" section above for a more detailed description.
  • Updated instructions on how to use custom events.

Version 1.4.2

  • Added addWmodeToObject. When a slider has an embedded object (like a youtube video), the script adds a wmode parameter with the value from this option ("opaque" by default).

Version 1.4.1

  • Added theme option and several themes. Themes can now be added to individual AnythingSliders (although they are based largely on CSS).
  • Added tooltipClass option which adds the assigned class name to the navigation and play/stop button only if the text is hidden (negative text-indent). The tooltip plugin must be added separately.
  • Added toggleArrows option. This option (if true) will slide out (reveal) the arrows while hovering & hide them at other times.
  • Added toggleControls option. This option (if true) will slide down (reveal) the navigation links and play/stop button while hovering & hide them at other times. Adding this option required a new "anythingControls" class that wraps both the navigation links and the play/stop button.

Version 1.4

  • Added maxOverallWidth option. This sets the max width (in pixels) of all combined sliders (side-to-side) due to problems with Opera.
  • Added new classes to the base UL ("anythingBase") and its immediate children LIs ("panels") to reduce and clarify the CSS.
  • Added hover class to arrows and start/stop button to indicate the link has focus (while tabbing through the page)
  • Fixed flickering problem completely :P - numerous changes made to script & CSS.
  • Bumped version to 1.4 because of significant differences from version 1.3.

Version 1.3.7

  • Added startPanel option.
  • Added playRtl option to reverse the play direction.
  • Added back stopAtEnd option (not should how it was removed from the options).
  • Added resumeOnVideoEnd option to prevent an active slideshow from pausing a video.
  • Changed location of reverse reference from the wrapping div ("anythingSlider" class) to the original ul ("silder1" id in the first example) - updated instructions.
  • Fixed height/width options to accept strings (e.g. "400px" instead of a number, it may not work properly if values are other than the numnber of pixels).
  • Fixed setting to accept strings (e.g. $(slider).anythingSlider(" 1 ")) as well as numbers.
  • Fixed problem with objects (youtube videos) flickering in Firefox by setting resizeContent to false.
  • Fixed problem that occurs when using an incorrect easing function name (submitted ticket: )
  • Reorganized, cleaned up the code and updated the demos & instructions.

Version 1.3.6

  • Fixed minor bug with links to specific slides and updated example to reflect changes and be less confusing
  • Tweaked start/stop button css to be more maleable

Version 1.3.5

  • Added resizePanel option - does not support percentage sizing.
    • When true, it will resize all panels & solitary content to the size settings (CSS or the script options).
    • When false, the AnythingSlider wrapper will resize to fit the panel (set inline or in the CSS for each panel).
  • Fixed keyboard navigation to work with multiple AnythingSliders on a page.
  • Added tabbed navigation. Both the links within panels and the thumbnail navigation will activate it.

Version 1.3.4

  • Added keyboard navigation.
  • Embeded objects will now resize to fit the panel.
  • YouTube videos will pause the video when it is not in view and play (if already started) if it is in view. Note: this feature only works in non-IE browsers and when the files are hosted on a webserver as the flash player restricts calls between local files and the internet.
  • Modified code according to JSLint & added minified version.

Version 1.3.3

  • Previous / Next arrows are now optional
  • Clicking start button immediately begins transition instead of waiting for the delay

Version 1.3.2

  • Greatly refactored CSS for a more fluid resizing behavior
  • Dimensions can be passed via javascript or modified at the top of the css file
  • Merged all Github forks
  • Wrapper DIVs (<div class="anythingSlider"><div class="wrapper">) no longer required in html. Divs are generated in jquery
  • Improved CSS scope and classes, Javascript degredation behaves differently however
  • Hash URLS now work for multiple panels

Version 1.3

  • Accessibility improvements by Matt Lawson
  • Some generic JavaScript/HTML/CSS code cleaning
  • Move to GitHub entirely
  • Ensures unique panel ID's
  • Removes navigation if there is only one panel
  • Added option to stop on the last page when autoPlay is set to true

Version 1.2

  • Bug Fix: When autoPlay was set to false, any interaction with the control would cause a javascript error.

Version 1.1

  • Changed default easing to "swing" so didn't depend on any other plugins
  • Removed extra junk (other plugins used for design, etc)
  • Added Pause on Hover option
  • Added options for passing in HTML for the start and stop button
  • Added option to use custom function for formatting the titles of the navigation
  • Added public interface for linking directly to certain slides

Version 1.0

  • First version
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.