Previously, in front-end html code, the use of marquee to implement horizontal and vertical scrolling of text or images, but with the consideration of browser compatibility and compliance with w3c standards, next we will introduce how to use Jquery to implement the marquee effect on webpages. If you are interested, you can find out that, in the front-end html code, the marquee is used to implement horizontal and vertical scrolling of text or images, but with the consideration of browser compatibility and compliance with w3c standards, I thought it would still be implemented using javascript code. Later, I liked jquery again. The content below will be helpful to beginners. Do not spray it, but I am very grateful for your guidance.
Principle: The principle of seamless rolling is to use two containers with the same content to achieve the visual effect of deceiving people. Then, the scroll bar of the entire large container can be moved up or down to implement scrolling. The following is a hand-drawn figure to briefly describe the principle. First, we aim to horizontally scroll the content in box 1 to the left (scroll to the right, the principle of up and down is actually roughly the same, as long as you know one of them, none of the above .). When loading the page, we use js to dynamically assign the content (html content) in box 2 to the same content as that in box 1. Then, move the scroll bar gradually to the Right to achieve the left effect. So much. The Code (with comments) will be attached ).
1.html code
The Code is as follows:
Juqery achieves the effect of marquee