Example of the text progressive of jQuery implemented upwards

This example describes the textual row of jQuery implementation to roll up. Share to everyone for reference, the specific code is as follows:

jQuery实现的文字逐行向上间歇滚动效果示例 Specific code is as follows:

 www.jb51.net jQuery text rolled up scrolling code      * {margin : 0px; Padding: 0px; font-family: 'Microsoft Ya black'; -Webkit-Tap-Highlight-Color: RGBA (0,0,0,0);} li {list-style: none} img {border: None} a {text-decoration: none;} / * ---------------------------------------------------------------------------------------------------------------------------------------- --------------------------- * /. Top_record {}. Record_top {width: 90%; Height: 50px; Text-Align: Center Line-height: 50px; margin: 30px auto 0px; color: # 000;}. TopRec_list dl, .maquee {width: 90%; overflow: hidden; margin: 0 auto; color: # 7c7c7c} .topRec_list dd {Float : Left; Text-Align: Center; Border-Bottom: 1px Solid # 1b96ee; color: # 1b96ee;}. TopRec_list dl Dd: nth-child (1) {width: 17%; HeighT: 40px; line-height: 40px;} .toprec_list dl Dd: nth-child (2) {width: 18%; Height: 40px; line-height: 40px;} .topRec_List DL Dd: nth-child (3) {Width: 25%; height: 40px; line-height: 40px;} .toprec_list dl Dd: nth-child (4) {width: 40%; Height: 40px; line-height: 40px;} .maquee {height: 195px;}. TopRec_list ul {width: 100%; Height: 195px;}. TopRec_list Li {Width: 100%; Height: 38px; line-height: 38px; text-align: center; font-size: 12px; border- Bottom: 1px dashed #aaa;} / *. TopRec_list li: nth-child (2n) {background: # 077cd0} * /. TopRec_list Li div} * /. TopRec_list Li div {FLOAT: LEFT;}. TopRec_List Li Div: nth-child (1) { Width: 17%;}. TopRec_List Li Div: nth-child (2) {width: 18%;}. TopRec_list Li div: nth-child (3) {width: 25%;}. TopRec_List Li Div: nth-child (4) {Width: 40%;}. Apple a {display: block; text-decoration: none;}. Apple, .a {width: 90%; HEIgHT: 50px; Overflow: hidden; margin: 30px auto; border: 1px solid # 1b96ee;}. Apple a, .aa a {width: 100%; Height: 50px; line-height: 50px; Text-Indent: 20px; Color: # 1b96ee;}. AA {Word-Wrap: Break-Word; line-height: 50px; color: # 1b96e;}      Cruise list     
Award
Time
1
2014/12/30 14:20
  • 2
    Wang **
    2014/12/30 14:20
  • 3
    Wang **
    30 yuan
    2014/12/30 14:20
  • 2014/12/30 14:20
  • Wang **
  • 3 yuan
    2014/12/30 14:20
    6
  • 2014/12/30 14:20
    7
    王 **
  • 3 yuan
    2014/12/30 14:20
    8
    Wang **
  • Function AutoScroll Obj) {$ (obj) .find ("ul"). Animate ({MARgintop: "-39px"}, 1000, function () {$ (this) .css ({margintop: "0px"}). Find ("li: first"). appendto (this);})} $ (Function () {var scroll = setInterval ('AutoScroll (". Maquee")', 1500); $ (". Maquee"). Hover ("aaa"); ClearInterval (scroll);} Function () {scroll = setItRVal ('autoscroll (". Maquee")', 1500);});};
  • Readers with jQuery related content can be viewed on this site: "jQuery switch special effects and skill summary", "jQuery drag and drop special effects and skill summary", "jQuery extension skill summary", "jQuery common classic special effects summary "," JQuery animation and special effects "," jQuery selector method summary "and" jQuery common plug-in and usage 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