The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How do I get something to scroll and stop on mouseover ?

View previous topic View next topic Go down

In progress How do I get something to scroll and stop on mouseover ?

Post by azwiz on March 1st 2015, 12:52 am

I have the following that I recieved from this support forum . So far I have been unsuccessful in getting scrolling text to stop on mouse over . Now I have forgotten how to even get the text to scroll . I don't know if there are two codes below , where to place the text , and what kind of widget will scroll .

hello @azwiz,

It depends, which widget would you like to scroll ? While we're on the topic, you can also create custom widgets that scroll content using the <marquee> element. Add this to a widget if you like :
Code: Select Content
<marquee direction="up" scrollamount="2">
<div onmouseover="this.parentNode.setAttribute('scrollamount','0')" onmouseout="this.parentNode.setAttribute('scrollamount','2')">Mouse over to stop me !</div>
</marquee>

You can replace the following in the code above with whatever you like.
Code: Select Content
<div onmouseover="this.parentNode.setAttribute('scrollamount','0')" onmouseout="this.parentNode.setAttribute('scrollamount','2')">Mouse over to stop me !</div>

azwiz
Forumember

Male Posts : 409
Reputation : 6
Language : english
Location : Apache Junction , Arizona USA

http://valleyofthesun.forumotion.co.uk/

Back to top Go down

In progress Re: How do I get something to scroll and stop on mouseover ?

Post by Ange Tuteur on March 1st 2015, 8:58 pm

Hello @azwiz,

See if this code works for you :
Code:
<marquee scrollamount="3" direction="up" onmouseover="this.setAttribute('scrollAmount','0')" onmouseout="this.setAttribute('scrollAmount','3')">
  I'm scrolling up !
  <br/>
  <br/>
  You can place whatever content you want in here.
</marquee>

You'll see the following attributes :

scrollamount="3" : the 3 between the quotes defines the speed of the scrolling. If you want it to be slower use a lower number such as 1, and to make it faster use a higher number such as 7. 0 stops the scrolling.

direction="up" : this defines the direction of the scrolling. Currently it's set to up, so the text will scroll up. You can use some of the following values : up, down, left, right.

You'll also see onmouseover and onmouseout. These are event handlers that execute JavaScript when your cursor enters and exits the <marquee> element. We're using setAttribute to manipulate the scrolling, because browsers like Firefox seem to have dropped support for the stop() and start methods.

Anyway, you only need to change one thing for onmouseout which is this 3 inside this.setAttribute('scrollAmount','3'). If you change the scrollamount to something other than three, make sure to change this as well.

To make it easy on you, there's also a generator here : http://www.quackit.com/html/html_generators/html_marquee_generator.cfm

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: How do I get something to scroll and stop on mouseover ?

Post by azwiz on March 2nd 2015, 7:35 am

Ok I have applied the code . I got text to scroll . The mouse over works , stops the text .
But
The text I am trying to sroll is a list of dates and names of people in a chronological order . One date , name , and event per line . It can be consecutive lines or skip a line but not runallininone sentence . When I click save in either mode "switch Editor " The lines automatically jumble together and don't even stay in order . I have tried to recopy and paste them and try it again . It keeps jumbling up . Is there something that I can add to the code to make the text stay as is ?
example
27 Feb
CJL73came in first place inSo U Think U can Play! Single Round, 18 hole on Me

27 Feb
CJL73came in first place inandrew's front vf.

27 Feb
CJL73came in first place inkiawah wah open III.

27 Feb
dschom5came in first place inckkc open I.

26 Feb
Buddha248came in first place in2 ROUNDS @ BPB H - M.

26 Feb
nitramgohtcame in first place in2 ROUNDS @ BPB L & TL.


and so on , down to feb 1st . How can I get this format to hold so this is what is seen when scrolling

azwiz
Forumember

Male Posts : 409
Reputation : 6
Language : english
Location : Apache Junction , Arizona USA

http://valleyofthesun.forumotion.co.uk/

Back to top Go down

In progress Re: How do I get something to scroll and stop on mouseover ?

Post by Ange Tuteur on March 2nd 2015, 9:18 am

Try adding some breaks to ensure that each portion is on its respective line. This is the HTML code to create a line break :
Code:
<br/>

Since you have it with a double break, you would use :
Code:
<br/><br/>

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum