Setup
Wiki Pages: "Home":https://github.com/Mottie/AnythingSlider/wiki | "Setup":https://github.com/Mottie/AnythingSlider/wiki/Setup | "Usage":https://github.com/Mottie/AnythingSlider/wiki/Usage ( "Appearance":https://github.com/Mottie/AnythingSlider/wiki/Appearance-Options , "Navigation":https://github.com/Mottie/AnythingSlider/wiki/Navigation-Options , "Slideshow":https://github.com/Mottie/AnythingSlider/wiki/Slideshow-Options , "Callbacks & Events":https://github.com/Mottie/AnythingSlider/wiki/Callbacks-and-Events , "Interactivity & Misc":https://github.com/Mottie/AnythingSlider/wiki/Interactivity-and-Miscellaneous-Options ) "Change":https://github.com/Mottie/AnythingSlider/wiki/Change-Log | "Credits":https://github.com/Mottie/AnythingSlider/wiki/Credits
h2. Default Options
$('#slider1, #slider2').anythingSlider({
// Appearance
width : null, // Override the default CSS width
height : null, // Override the default CSS height
resizeContents : true, // If true, solitary images/objects in the panel will expand to fit the viewport
tooltipClass : 'tooltip', // Class added to navigation & start/stop button (text copied to title if it is hidden by a negative text indent)
theme : 'default', // Theme name
themeDirectory : 'css/theme-{themeName}.css', // Theme directory & filename {themeName} is replaced by the theme value above
// Navigation
startPanel : 1, // This sets the initial panel
hashTags : true, // Should links change the hashtag in the URL?
enableKeyboard : true, // if false, keyboard arrow keys will not work for the current panel.
buildArrows : true, // If true, builds the forwards and backwards buttons
toggleArrows : false, // if true, side navigation arrows will slide out on hovering & hide @ other times
buildNavigation : true, // If true, builds a list of anchor links to link to each panel
enableNavigation : true, // if false, navigation links will still be visible, but not clickable.
toggleControls : false, // if true, slide in controls (navigation + play/stop button) on hover and slide change, hide @ other times
appendControlsTo : null, // A HTML element (jQuery Object, selector or HTMLNode) to which the controls will be appended if not null
navigationFormatter : null, // Details at the top of the file on this use (advanced use)
forwardText : "»", // Link text used to move the slider forward (hidden by CSS, replaced with arrow image)
backText : "«", // Link text used to move the slider back (hidden by CSS, replace with arrow image)
// Slideshow options
enablePlay : true, // if false, the play/stop button will still be visible, but not clickable.
autoPlay : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
startStopped : false, // If autoPlay is on, this can force it to start stopped
pauseOnHover : true, // If true & the slideshow is active, the slideshow will pause on hover
resumeOnVideoEnd : true, // If true & the slideshow is active & a youtube video is playing, it will pause the autoplay until the video is complete
stopAtEnd : false, // If true & the slideshow is active, the slideshow will stop on the last page
playRtl : false, // If true, the slideshow will move right-to-left
startText : "Start", // Start button text
stopText : "Stop", // Stop button text
delay : 3000, // How long between slideshow transitions in AutoPlay mode (in milliseconds)
animationTime : 600, // How long the slideshow transition takes (in milliseconds)
easing : "swing", // Anything other than "linear" or "swing" requires the easing plugin
// Callbacks
onBeforeInitialize : null, // Callback before the plugin initializes
onInitialized : null, // Callback when the plugin finished initializing
onShowStart : null, // Callback on slideshow start
onShowStop : null, // Callback after slideshow stops
onShowPause : null, // Callback when slideshow pauses
onShowUnpause : null, // Callback when slideshow unpauses - may not trigger properly if user clicks on any controls
onSlideInit : null, // Callback when slide initiates, before control animation
onSlideBegin : null, // Callback before slide animates
onSlideComplete : null, // Callback when slide completes
// Interactivity
clickArrows : "click", // Event used to activate arrow functionality (e.g. "click" or "mouseenter")
clickControls : "click focusin", // Events used to activate navigation control functionality
clickSlideshow : "click", // Event used to activate slideshow play/stop button
// Misc options
addWmodeToObject : "opaque", // If your slider has an embedded object, the script will automatically add a wmode parameter with this setting, if swfobject.js is active
maxOverallWidth : 32766 // Max width (in pixels) of combined sliders (side-to-side); set to 32766 to prevent problems with Opera
});
h2. Setup
h3. Add the following inside the of your page
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.anythingslider.js"></script>
<script type="text/javascript">
$(function () {
$('#slider1').anythingSlider(); // add any non-default options here
});
</script>
<script type="text/javascript" src="js/jquery.easing.1.2.js"></script>
<script type="text/javascript" src="js/swfobject.js"></script>h3. Example HTML
- Put anything you want here
- ...