JavaScript implemented scrolling bulletin effects [JQuery]

  • 的头像-Tumi
  • 44 day agopublish

This example tells the scroll announcement of JavaScript implementation. Share to you for your reference, as follows:

Share a special effects of scrolling announcements today.

JavaScript实现的滚动公告特效【基于jQuery】 Code:

  Scrolling announcement     body {margin: 20px;} ul {width: 200px; list-style-type : none; border: 1px solid red;} li {height: 30px; line-height: 30px}      I am Article 1 Announcement   I Is the 2nd announcement  
    I am Article 3 Announcement
  • I am Article 4 Announcement
  • I am Article 5 Announcement
  • I am 6 announcements
  • I am article 7 announcement
  • I am Article 8 Announcement
  • I am Article 9 Announcement
  • I am Article 10 Announcement
  • // Perform a function setInterval (Function () {$ ('ul>: first'). Clone (TRUE) .Appendto ('UL') ; / / Copy a new node and add to the UL $ ('UL>: first '). remove (); // Remove the original node};
  • There is a UL in the page, first Write a timer, perform a function per second, copy one part in the UL in the function and add it to the bottom of the UL, and finally delete the original entry.
Interested friends can use online HTML / CSS / JavaScript code run tool : http: //tools.jb51.net/code/htmljsrun Tests the code running effect. More about jQuery related content, readers can be viewed on this site: "jQuery page element operation skills summary", "jQuery common event usage and skill summary", "jQuery common plug-in and usage summary", "JQuery extension skill summary" and "JQuery Selector Summary"
I hope this article will help you jQuery program.
© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment