jquery implements announcement scrolling effect_jquery

The rolling effect is very good and the code is very simple, so there won’t be much nonsense here.

Copy code The code is as follows: //Style file: * { margin: 0; padding: 0; } .scrollNews { width: 100%; Height: 20px; overflow: hidden; background: #FFFFFF; Border: 0px solid #AAAAAA; } .scrollNews ul { padding: 2px 5px 5px 25px; } .scrollNews ul li { Height: 20px; list-style-type: none; font-size: small; } a { text-decoration: none; } Header js

Don’t forget to import the jquery library

Copy code The code is as follows: $(function () { var settime; $(".scrollNews").hover(function () { Clearinterval (settime); }, function () { settime = setInterval(function () { Var $ first = $ (". Scrollnews ul: first"); // Select the first ul under the div instead of li; var height = $first.find("li:first").height(); // Get the height of the first li and prepare for the ul to move upward; $first.animate({ "marginTop": -height "px" }, 600, function () { $ First.css ({margintop: 0}). Find ("li: first"). }); }, 3000); }). Trigger ("mouseLeave"); // trigger () method of the trigger () method is to trigger the type of events of the selected element });

jsp text area

Copy code The code is as follows: Query module menu name update announcement: Starting from 2015-02-09, the query module menu uses a new name. For details, please refer to the [New and old name comparison table of query module] below. Query module menu name update announcement: Starting from 2015-02-09, the query module menu uses a new name. For details, please refer to the [New and old name comparison table of query module] below.

Friends, feel free to use it in your own projects