又是一次作業練習,jquery消息滾動,效果圖如下: 源碼下載及效果預覽:https://www.jq22.com/jquery-info22971 代碼實現起來很簡單,所以看起來效果也是很不如人意,就當記錄一下子趴 推薦鏈接 無縫滾動:http://www.jq22.com/jquery-info ...
又是一次作業練習,jquery消息滾動,效果圖如下:
源碼下載及效果預覽:https://www.jq22.com/jquery-info22971
代碼實現起來很簡單,所以看起來效果也是很不如人意,就當記錄一下子趴
推薦鏈接
無縫滾動:http://www.jq22.com/jquery-info22981
推送滾動:http://www.jq22.com/jquery-info22468
現在來簡單寫一下自己的這個代碼實現
js代碼:
$(function(){ //滾動事件,每兩秒滾動一次 var mun =setInterval(function(){ $("li:last").hide("slow").prependTo($("#file0")).slideDown(); },2000); //滑鼠懸停事件,懸停停止滾動,滑鼠移出開始滾動 $("li").hover(function(){ clearInterval(mun); },function(){ mun = setInterval(function(){ $("li:last").hide("slow").prependTo($("#file0")).slideDown(); },2000); } );
過一遍jq的方法和事件
定時器:
setInterval() :按照指定的周期(以毫秒計)來調用函數或計算表達式。方法會不停地調用函數,直到 clearInterval() 被調用或視窗被關閉。
setTimeout() :在指定的毫秒數後調用函數或計算表達式。
定時器是使用js的內容。詳情參考 https://www.runoob.com/w3cnote/js-timer.html
hide屬性:隱藏顯示的元素和它對應的是show屬性代碼中的slideDown可以替換成show(),都是動畫效果而已
prependTo屬性:把所有匹配的元素前置到另一個、指定的元素元素集合中。案例中是每隔一秒把最後一個li添加到ul中,
代碼太簡潔了不知道寫啥了QAQ