HTML部分:
<%- メッセージのスクロールを配置する- %> < divのクラス= "messageWrap borderBox" > < divのクラス= "メッセージborderBox" > < UL ID = "お知らせ" > < 李クラス= "テキスト省略記号" >このメッセージ0 </ 李> < 李クラス=「テキスト省略記号は」>このメッセージである。1 </ 李> < 李クラス=「テキスト省略記号は」>これはメッセージ2です</ 李> </ UL> </ DIV > </ DIV >
CSSのセクション:
/ * ============スタイルにメッセージをスクロール=========== * / .messageWrap { 位置:絶対 ; 底:0 ; 高さ:0.64rem ; 幅:100% ; パディング:0 0.2rem ; オーバーフロー:隠された ; } .message { 幅:100% ; 背景:#FFF ; ボーダーRADIUS-左上:20ピクセル ; ボーダーRADIUSトップ右:20ピクセル、 高さ:100% ; オーバーフロー:隠された ; パディング左:0.2rem ; } .messageのLi { 行の高さ:0.64rem ; } / * ============スタイルにメッセージをスクロール============= * /
JS一部:
// 消息通知上下翻滚 VAR NUM = $( "#通知")( "LI"を見つける。).LENGTHを。 もし(NUM> 1 ){ たsetInterval(関数(){ $( '#notice' ).animate({ marginTop: "-26px" }、 500、関数(){ $(この)の.css({marginTop:「0 "})(見つける。" LI:。)最初の「appendTo(この); }); }、 3000 )。 }