HTML/[removed] How to stop marquee onload, and sta

2019-05-06 14:00发布

站内问答 / JavaScript
897 4 3

I'm using the following HTML piece of code to scroll text horizontally:

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

The issue I have is that once you visit the page, the marquee starts scrolling automatically. What I want to do, is to freeze the marquee until you mouseover.

4条回答
乱世女痞
2楼-- · 2019-05-06 14:27

Try one of these.

<!-- MOVING UP -->
<marquee direction="up" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);"></marquee>

<!-- MOVING DOWN -->
<marquee direction="down" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);"></marquee>

<!-- MOVING LEFT -->
<marquee direction="left" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);"></marquee>

<!-- MOVING RIGHT -->
<marquee direction="right" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);"></marquee>
查看更多
0人赞 添加讨论(0) 举报
傲
3楼-- · 2019-05-06 14:31

I'm going to sound condescending here...

Its 2013. The marquee tag is dead. It is browser specific. It is just plain wrong and was a mistake to begin with.

In the modern era of semantic html one should be using html to define content. Visual styling should be applied with CSS and visual effects with CSS supplemented with javascript if required.

See this article for a biref overview of a modern approach.

There are pure CSS3 approaches: http://www.hongkiat.com/blog/css3-animation-advanced-marquee/

and probably best for you: javascript (and jQuery) solutions: http://remysharp.com/2008/09/10/the-silky-smooth-marquee/. Note: the examples in the linked solution use the marquee tag, but you are not limited to using the marquee tag. You can use any valid jquery selector.

查看更多
0人赞 添加讨论(0) 举报
爱情/是我丢掉的垃圾
4楼-- · 2019-05-06 14:36

You could tinker with scrollAmount instead of calling start() and stop(), and just set scrollamount to 0 initially. E.g.

<marquee behavior="scroll" direction="left" scrollamount="0" onmouseover="this.scrollAmount = 6" onmouseout="this.scrollAmount = 0">Go on... hover over me!</marquee>

See http://jsfiddle.net/svt9L/

Note that this is a direct answer to your question. However I fully endorse Jon P's answer. There are better solutions available than using the marquee element.

查看更多
0人赞 添加讨论(0) 举报
Bombasti
5楼-- · 2019-05-06 14:43 
<marquee id="myMarquee" behavior="scroll" direction="left" onmouseover="this.start();" onmouseout="this.stop();">Go on... hover over me!</marquee>

<body onload="document.getElementById('myMarquee').stop();">
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(3)