79196

How to stop marquee slide show on mouse over in JavaScript?

I want to stop slide show on mouse over and start on mouse out. I saw some suggestions in stack overflow. In that i didn't get any solution (may be this is my fault to understand the others code according to my code. So because of that i am giving my code).

<marquee height="80%" width="600px" direction="left" scrolldelay="120" align="middle"> <div class="itemMar"><img src="http://static.ddmcdn.com/gif/storymaker-best-hubble-space-telescope-images-20092-514x268.jpg" width="120px" height="120px" border="5"/><br /><p style="text-align: center;">name</p><p style="text-align: center;">0123456789</p><p style="text-align: center;">ssc</p> </div> <div class="itemMar"><img src="http://static.ddmcdn.com/gif/storymaker-best-hubble-space-telescope-images-20092-514x268.jpg" width="120px" height="120px" border="5"/><br /><p style="text-align: center;">name</p><p style="text-align: center;">0123456789</p><p style="text-align: center;">ssc</p> </div> <div class="itemMar"><img src="http://static.ddmcdn.com/gif/storymaker-best-hubble-space-telescope-images-20092-514x268.jpg" width="120px" height="120px" border="5"/><br /><p style="text-align: center;">name</p ><p style="text-align: center;">0123456789</p><p style="text-align: center;">ssc</p> </div> <div class="itemMar"><img src="http://static.ddmcdn.com/gif/storymaker-best-hubble-space-telescope-images-20092-514x268.jpg" width="120px" height="120px" border="5"/><br /><p style="text-align: center;">name</p ><p style="text-align: center;">0123456789</p><p style="text-align: center;">ssc</p> </div> </marquee>

Answer1:

Try this

<marquee behavior="scroll" direction="left" onmousedown="this.stop();" onmouseup="this.start();"></marquee> <marquee behavior="scroll" direction="left" onmouseover="this.stop();" onmouseout="this.start();"></marquee>

Answer2:

If you don't want to write your JavaScript inline, you can put this in a JavaScript file:

marquee = document.getElementsByTagName('marquee')[0]; marquee.onmouseover = function(){ this.stop(); } marquee.onmouseout = function(){ this.start(); }

Here's a demo: http://jsfiddle.net/8fymm/1/

Answer3:

try this,

<marquee behavior="scroll" direction="left" onmouseover="this.stop();" onmouseout="this.start();">Go on... hover over me!</marquee>

see your live Demo</kbd>

Recommend

  • how to show news without marquee tag
  • Centering a specific element among others with flexbox [duplicate]
  • How do one only submit click event (div), when using jquery live function?
  • Is there a way to pivot a customer ID and a their most recent order dates?
  • TCPDF's getNumLines() is sometimes wrong
  • how to calculate distance between two points in google maps?
  • Play Framework nested form errors missing
  • Put percent labels next to legend instead of in the slice
  • HABTM associations in Rails : collecting and counting the categories of a model's children
  • IOS > Open URL in Safari with POST
  • Guava how to copy all files from one directory to another
  • Position: fixed nav does not stay fixed
  • Debug.DrawLine not showing in the GameView
  • Custom validator control occupying space even though display set to dynamic
  • Change multiple background-images with jQuery
  • FileReader+canvas image loading problem
  • Insert into database using onclick function
  • Deselecting radio buttons while keeping the View Model in synch
  • Optimizing database types to compact database (SQLite)
  • How do I fake an specific browser client when using Java's Net library?
  • Why HTML5 Canvas with a larger size stretch a drawn line?
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • How to check if every primary key value is being referenced as foreign key in another table
  • Change an a tag attribute in JavaScript based on screen width
  • Alternatives to the OPTIONAL fallback SPARQL pattern?
  • Do I've to free mysql result after storing it?
  • QuartzCore.framework for Mono Develop
  • Python - Map / Reduce - How do I read JSON specific field in using DISCO count words example
  • Warning: Can't call setState (or forceUpdate) on an unmounted component
  • bootstrap to use multiple ng-app
  • How to get icons for entities from eclipse?
  • Proper way to use connect-multiparty with express.js?
  • python regex in pyparsing
  • Turn off referential integrity in Derby? is it possible?
  • JaxB to read class hierarchy
  • Checking variable from a different class in C#
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?