Simplyscroll is a jquery plug-in that can automatically or manually, horizontally, or vertically scroll a series of elements. It can receive dynamic images or JSON source images from the Flickr feed. It is very powerful and can achieve rich effects.
Instructions for use
You need to use the jquery library file and the simplyscroll Library File
You need to customize CSS styles for display elements (such as images)
Use instance
1. Contains the file section
- <SCRIPT type = "text/JavaScript" src = "/jquery. js"> </SCRIPT>
- <SCRIPT type = "text/JavaScript" src = "jquery. simplyscroll. js"> </SCRIPT>
- <LINK rel = "stylesheet" href = "jquery.simplyscroll.css" Media = "all" type = "text/CSS">
Ii. html Section
- <Ul id ="Scroller">
- <Li> </LI>
- <Li> </LI>
- <Li> </LI>
- </Ul>
Iii. Javascript
- <SCRIPT type = "text/JavaScript">
- (Function ($ ){
- $ (Function (){
- $ ("#Scroller"). Simplyscroll ({
- Automode: 'Login ',
- });
- });
- }) (Jquery );
- </SCRIPT>
The above example shows that using the jquery plug-in simplyscroll is very simple and you can achieve the rolling effect by defining the elements to be displayed (such as images in the instance.
Simplyscroll parameter list (For details, refer to the JS library file of the jquery plug-in simplyscroll)
- Classname 'smooth-scroll' CSS Class Name
- Framerate 24-second moving or frame quantity
- Speed 1 The number of pixels that move per frame.
- Horizontal true direction of movement, horizontal or vertical
- Automode'Off' indicates whether the automatic mode loop or bounce is enabled.
- Pauseonhover true: whether to pause when hovering
- Flickrfeed ''calls JSON to use the Flickr feed path.
- Jsonsource ''calls the local JSON
- Jsonimgwidth 240 the width of the image in the Flickr/JSON format.
- Jsonimgheight 180 the Image Height of the Flickr/JSON File
Download demo