Example: In this example we will use the HTML marquee tag.
Note: Do not use the marquee tag inside your code because it is deprecated and can break your code in the future.
CSS Code: Now add some CSS to the code. Here in the wrapper div (In which all the <p> tags reside) make the overflow hidden (This is necessary) and set the background color, border, width of your choice. And in the <p> tag there should be three necessary properties white-space, float, and clear. The white-space should be set to nowrap, float to be left, and clear to be both and other designing properties of your choice.
- Create a variable named elementWidth and assign the offsetWidth of the <p> element
- Create a variable name parentWidth and assign the offsetWidth of the parent element of the <p> element.
- Create flag variable and initialize it with 0
- Create a setInterval with a 10-millisecond refresh rate.
- At every Interval decrease the flag value and set that value to the margin-left property.
- If the negative value of the flag is equal to the element’s width then set the value of margin-left equal to the parent’s width.
Output: After combining above three section we will see something like this.