liMarquee

liMarquee jQuery plugin - horizontal and vertical scrolling of text or image or html code

Text Content

Universal Marquee for Text, HTML and Images More than 10 000 people have been using it

HTML Content

WilleyWiley Captures $1,860,000+ Annually from BrightEdge and Natural Search Plow and HeartsPlow & Hearth Increases Weekly SEO Revenue 1157% TimeIncHow Time Increased Key Search Traffic Over 45% 3M3M Captures $300,000 a Year in Organic Value GROUPONGroupon Finds Up to 60% of Direct Traffic Search

IMAGES Content

DOWNLOAD PLUGIN LIMARQUEE

Overview plugin

Quick Install Plugin

Cross-browser

The plugin supports all popular browsers, such as: Opera, Mozilla Firefox, Google Chrome, Internet Explorer, Safari

Touch mobile compatible

All functionality is fully supported on the touch devices

Stop and Start

You can pause Marquee when mouse hover, and play when mouse out

Drag and drop

You can move Marquee by the mouse cursor for a comfortable reading or viewing position

Multidirectional

The movement of the Marquee can be set both horizontally (left, right) and vertical (up and down)

Unlimited type content

The content can be any web page element - a simple text, images, tables, form elements, etc.

It is possible to upload text from an XML file

Dynamic Control

All parameters can be changed dynamically

Window Resize

Supports change of screen sizes

Change Content

The content can be deleted, changed or added dynamically at any time

Page Scroll

Detecting when a marquee is scrolled into view. Outside screen marquee stops. Inside screen marquee starts to move. When the page is scrolled, the line stops

Callback

Almost all of the events have a callback functions

Templates

For the lazy there is a set of predefined templates to suit different tastes

Quick Start (youtube)

Unzip "liMarquee" (use "WinRAR" program, or other).
Go to the folder "quick_start".

In this folder you will find a file "CodeToCopy.html", folder "js" and the folder "css".
Copy the folders "js" and "css" into folder with your site. If you already have such folders, copy only the contents of these both folders.
Open the file "CodeToCopy.html" in any editor.

And copy its contents to the clipboard.
Paste this contents into the code of your page, in the place where a moving text should be.

If you have copied the files of scripts and styles into other folders, don't forget to change the path to them in code of including these files.
Save the changes in your file.
Done.

Include files <head> ...[THIS CODE]... </head>

			
<!--If you have already use jquery, then this line is not necessary-->
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

<!-- Plugins files-->
<link rel="stylesheet" href="css/liMarquee.css">
<script src="js/jquery.liMarquee.js"></script>

Plugins Initialization <head> ...[THIS CODE]... </head>

			
<script>
$(window).on('load',function(){
	$('.anyClass').liMarquee();
})
</script>

HTML <body> ...[THIS CODE]... </body>

	
<div class="anyClass mWrap">				
	<!--Start Your Content-->
	In place of the text string can be any html code or picture
	<!--End Your Content-->	
</div>

Options

Option	Default value	Datatype	Description
width	"auto"	String, Number	Sets width of the Marquee. It may take the values: any positive number or "auto"
height	"auto"	String, Number	Sets height of the Marquee. It may take the values: any positive number or "auto"
direction	"left"	String	Sets the direction of the Marquee It may take the values: "left", "right", "up", "down"
scrollDelay	85	Number	Sets the interval between each scroll movement in milliseconds It may take the values: any positive number
scrollAmount	6	Number	Sets the amount of scrolling at each interval in pixels It may take the values: any positive number
circular	false	Boolean	Creates the effect of an infinite line. It may take the values: true, false
dragAndDrop	true	Boolean	Enable the opportunity to drag the Marquee by the mouse It may take the values: true, false
hoverStop	true	Boolean	Enable the opportunity to pause the Marquee when mouse hover It may take the values: true, false
scrollStop	true	Boolean	Enable the opportunity to pause the Marquee when scroll page It may take the values: true, false
startShow	false	Boolean	If it is true - the content of marquee appears immediately if the lie - gradually It may take the values: true, false
xml	false	Boolean, String	Path to XML file. Imports an external XML file with content, and downloads the content in Marquee. It may take the values: XML file path or false
removeContentFadeDuration	300	number	The duration of fading when removing the content of marquee in ms It may take the values: any positive number
touchEvent	true	boolean	This parameter determines if the ticker responds to touch events or not It may take the values: true or false
stopOutScreen	true	boolean	This parameter specifies, the ticker will stop outside the screen or not It may take the values: true or false

Methods

getContent()	Returns the actual content of the Marquee This method does not accept any arguments $('.str').liMarquee('getContent');
addContent(string)	Adds to marquee the new content string Type: string The new content. $('.str').liMarquee('addContent','New Content');
removeContent()	Remove from marquee all content This method does not accept any arguments $('.str').liMarquee('removeContent');
changeOptions(options)	Restarts line with the new settings options Type: object The new options. $('.str').liMarquee('changeOptions',{direction:'right',circular:false});
destroy()	Removes all the functionality of Marquee. It returns the element in the condition before the initialization of the plug-in This method does not accept any arguments $('.str').liMarquee('destroy');
stop()	Stop movement Marquee This method does not accept any arguments This method does not accept any arguments $('.str').liMarquee('stop');
start(delay)	Start movement Marquee options Type: Number The delay before starting the animation, ms. Default Value: 0 $('.str').liMarquee('start', 300);
resetPosition()	Reset start end end position of marquee Animation This method does not accept any arguments $('.str').liMarquee('resetPosition');

Events

create()	Triggered when the liMarquee is created $('.str').liMarquee({ create: function(){} });
moveStart()	Triggered when motion starts $('.str').liMarquee({ moveStart: function(){} });
moveStop()	Triggered when motion stops $('.str').liMarquee({ moveStop: function(){} });
drag()	Triggered while the string is moved during the dragging $('.str').liMarquee({ drag: function(){} });
dragStart()	Triggered when dragging starts $('.str').liMarquee({ dragStart: function(){} });
dragStop()	Triggered when dragging stops $('.str').liMarquee({ dragStop: function(){} });
wayEnd()	Triggered when way ended $('.str').liMarquee({ wayEnd: function(){} });

Change Log

v.6.5.2
- 18/01/2021 A passive listener has been added to touch events, which should increase the page performance when scrolling
v.6.5.1
- 26/02/2019 Fixed destroy method error, linked to switching tabs
v.6.5.0
- 27/10/2017 Now, when the "left"/"right" and "top"/"bottom" parameters are changed, the scrolling line is not reloaded.
v.6.4.0
- 27/10/2017 Now, when the "scrollAmount" and "scrollDelay" parameters are changed, the scrolling line is not reloaded.
v.6.3.0
- 27/08/2016 All parameters can be transmitted via data attributes. Attributes date have A higher priority.
v.6.2.0
- 02/08/2016 Added a very important update. Now the marquee will stop at an inactive browser tab and thus frees up CPU resources.
v.6.1.0
- 28/07/2016 Added support for jQuery 3.x.x library.
- 28/07/2016 Added the function of distinguish events "scroll" from the event "drag" in touch devices.
v.6.0.5
- 30/06/2016 Added section "Quick Start" in documentation.
- 23/06/2016 Added support desktop PC with a touch screen
v.6.0.4
- 23/06/2016 Added "stopOutScreen" parameter. This parameter specifies, the ticker will stop outside the screen or not
v.6.0.3
- 23/06/2016 Fixed page scrolling on touch devices
v.6.0.2
- 22/06/2016 Added "touchEvent" option on / off the drag to "touch" devices
v.6.0.1
- 18/06/2016 Improved smoothness of animation
v.6.0.0
- 28/05/2016 Simplified structure of the HTML code. Now is enough wrap the content by only one element. See example. Attention! Those who are using earlier versions, you can to not change the HTML code!
- 28/05/2016 Simplified file structure See guide.
- 28/05/2016 Added the ability to post on the page at the same time vertical and horizontal ticker See guide.
v.5.7.4
- 13/05/2016 Fixed clickable child elements
v.5.7.3
- 26/04/2016 Changed example with HTML content
v.5.7.2
- 14/04/2016 Added new event "wayEnd()"
v.5.7.1
- 19/02/2016 Fixed Destroy method
- 19/02/2016 Added Destroy demo page
v.5.7
- 11/02/2016 Fixed work with empty string
v.5.6
- 26/01/2016 Fixed work with xml file
- 27/01/2016 In elements ".mItem" fixed css "display:inline-block" for IE7
v.5.5
- 06/01/2016 Added folder "quick_start"
- 06/01/2016 Added video "QUICK INSTALL PLUGIN"
v.5.4
- 23/12/2015 Fixed work with image content on touch devices
v.5.3
- 14/11/2015 Fixed work with hidden elements
- 14/11/2015 Added demo with Tabs
v.5.2
- 13/11/2015 Fixed click event on linked elements
- 13/11/2015 Fixed behavior of the image when you use bootstrap
v.5.1
- 09/11/2015 Fixed behavior when scroll event
v.5.0
- 10/10/2015 Optimized code (14KB to 10KB)
- 12/10/2015 Added touch events for Mobile devices
- 13/10/2015 Added new Options: width, height, scrollDelay, scrollAmount, scrollStop, startShow, removeContentFadeDuration
- 14/10/2015 Added new methods: getContent, addContent, removeContent, changeOptions, resetPosition
- 15/10/2015 Added new Events: create, moveStart, moveStop, drag, dragStart, dragStop
v.4.8
- 03/10/2015 Changed Event of Pause
- 04/10/2015 Added New Templates
v.4.7
- 28/09/2015 - Fixed the starting position of a long string v.4.6
- 11/20/2014 Added methods & quot; pause & quot; and & quot; play & quot; to pause / start traffic line
- 10/30/2014 Added the ability to dynamically change the speed of the line (see demo: & quot; Change speed & quot;)
- 04/27/2014 Added method & quot; destroy & quot ;, which removes all the functionality running line item and returns to the state before initializing plug
- 03/30/2014 Posted cycling short line when you drag
- 03/30/2014 Fixed bug positioning long line when you drag
v.4.5
- 03/23/2014 Added lock random event & quot; click & quot;
v.4.4
- 02/09/2014 Added parameter & quot; inverthover & quot ;, which inverts the standard response to hovering over.
- 02/09/2014 Ipravlen bug when dragging a looped line
v.4.3
- 01/21/2014 Fixed speed calculation using the method & quot; update & quot;
v.4.2
- 04/12/2013 Added method & quot; update & quot ;, which updates the initialization string after changing the internal content
v.4.1
- 02/12/2013 Added the ability to load an XML file multi
v.4.0
- 11/22/2013 Added parameter & quot; hoverstop & quot ;. If the value is & quot; true & quot; - The line stops when the mouse (the default), & quot; false & quot; - The line does not stop
- 11/22/2013 Movement short line from right to left and top to bottom now starts correctly (movement starts from the opposite end of the line)
v.3.3
- 10.12.2013 Added ability to dynamically changing traffic line
v.3.2
- 07/09/2013 Added the ability to drag and drop a line image
- 07/09/2013 Fixed a bug when you drag the line (when the mouse while holding LM went beyond the line)
- 06/09/2013 Added the example of HTML blocks
v.3.1
- 30.07.2013 Added horizontal movement the right direction: 'right'
v.3.0
- 05/24/2013 Posted movement vertically downward direction: 'down'
- 05/17/2013 Added ability podgruzki text from xml file
v.2.0
- 20.02.2013 Fixed bug in a continuous line, which led to an unexpected acceleration ticker
- 01/26/2013 Added the possibility of motion-controlled short-line (option: & quot; runshort & quot ;, values: & quot; true & quot; or & quot; false & quot;)
- 22.01.2013 №2 - Fix for slow internet. In HTML, the recommended element immediately build upon the class of & quot; str_wrap & quot ;. The file itself liMarquee.css for it was little changed
- 22.01.2013 №1 - Fix for IE9. With version jQuery 1.8 does not function $ (window) .load () - This bug is addressed in version 1.9.0, so the script is included, along with jquery version 1.9.0

Universal Marquee for Text, HTML and Images
More than 10 000 people have been using it