File: config_example.html

Recommend this page to a friend!
  Classes of Arturs Sosins   Marquee   config_example.html   Download  
File: config_example.html
Role: Example script
Content type: text/plain
Description: Example of configuration options
Class: Marquee
Display a marquee that scrolls automatically
Author: By
Last change: credits changed
Date: 13 years ago
Size: 2,139 bytes
 

Contents

Class file image Download
<!-- /************************************************************* * This script is developed by Arturs Sosins aka ar2rsawseen, http://webcodingeasy.com * Fee free to distribute and modify code, but keep reference to its creator * * Marquee class can be used to create horizontal or vertical marquee elements in websites * This class rotates all provided html elements, so marquee will never be empty * Marquee div element can be customized using css styles * There are also customizations for rotating speed and separator, etc * * For more information, examples and online documentation visit: * http://webcodingeasy.com/JS-classes/Javascript-marquee **************************************************************/ --> <html> <head> <style> body { text-align: center; } #container { width:1000px; margin: 0 auto 0 auto; height:500px; border: 3px solid black; } #marquee { width: 600px; height: 60px; border: 1px solid black; margin: 0 auto 0 auto; } #marquee div { border: 1px solid red; padding: 20px; height: 60px; } .wop { padding: 0; margin: 0; } </style> </head> <body> <div id='container'> <div id='marquee'> <p class='wop'><a href=''>Some text</a></p> <p class='wop'><a href=''>More text</a></p> <p class='wop'><a href=''>more more more</a></p> <p class='wop'>end even more</p> </div> somecontent <p>somecontent here</p> <div> and here </div> </div> <script type="text/javascript" src="./marquee.packed.js" ></script> <script type="text/javascript"> //create instance and call method horizontal for horizontal scrolling var horizontal = new marquee("marquee").horizontal( { step:1, //how many pixels to move per interval (default: 1) interval: 15, //how often to move pixels in miliseconds (default: 10) stop_on_hover: false, //should marquee stop on mouse hover (default: true) backwards: true, //rotate elements in opposite direction (default: false) separator: "<img src='./sep.png' height='9px' width='9px' border='0'/>" //separator to insert between html nodes (default: "") }); </script> </body> </html>