Giter Site home page Giter Site logo

directoryslider's Introduction

#Directory Slider ###Loads all images in a specified directory and creates a slide show ####Version: 0.9 For more information and support when I have time or am feeling frisky ===> http://www.justinwhall.com/directory-jquery-slider/

##Instalation

###Step 1: Link required files

<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- directorySlider Javascript file -->
<script src="/js/directorySlider.js"></script>

###Step 2: Create HTML markup

<div class="directorySlider"></div>

###Step 3: Call Directory Slider

$(document).ready(function(){
  $('.directorySlider').directorySlider();
});

##Configuration Options

animation Type of Animation.

default: 'fade'
options: 'fade', 'uncover'

filebase Type base of all files in you directoy. Ex: for files slide_01.jpg, slide_02.jpg and slide_03.jpg the filebase would be 'slide_' and for img_01.png, img_02.png and img_03.png the filebase would be 'img_'.

default: 'slide_'
options: string

extension The file extension of the files you are using.

default: 'jpg'
options: any image format (string)

directory The directory of your slides.

default: null
options: '/path/to/slides/folder'

numslides Number of slides in directory.

default: null
options: integer

###Optional Options speed Slide transition speed in milliseconds.

default: 1000
options: integer

timeout Time between slides.

default: 4000
options: integer

height Height of your slideshow in pixels.

default: null
options: integer

width Width of your slideshow in pixels.

default: null
options: integer

directoryslider's People

Contributors

jmo-jr avatar munhozthiago avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.