* * * * *
1.滾動方向direction(包括4個值:up、 down、 left和 right)
語法:<marquee direction="滾動方向">...</marquee>
2.滾動方式behavior(scroll:循環滾動,默認效果; slide:只滾動一次就停止; alternate:來回交替進行滾動)
語法:<marquee behavior="滾動方式">...</marquee>
3.滾動速度scrollamount(滾動速度是設置每次滾動時移動的長度,以像素為單位)
語法:<marquee scrollamount="5">...</marquee>
4.滾動延遲scrolldelay(設置滾動的時間間隔,單位是毫秒)
語法:<marquee scrolldelay="100">...</marquee>
5.滾動循環loop(默認值是-1,滾動會不斷的循環下去)
語法:<marquee loop="2">...</marquee>
6.滾動范圍width、height
7.滾動背景顏色bgcolor
8.空白空間hspace、vspace
* * * * *
~~~
//danmu函數
//參數說明:box:彈幕在哪個盒子中出現(原生獲取);
//content:彈幕內容;
//styleClass:樣式類名;
//speed:運動速度,單位為px/s(每秒運動多少像素);
//startTime:開始的時間,單位為毫秒
function danmu(box,content,styleClass,speed,startTime){
function add(content,speed){
var html = "";
html+="<marquee scrolldelay='500' direction='left' scrollamount='"+speed+"' class='"+styleClass+"'>"+content+"</marquee>";
//將彈幕插入要顯示的盒子中
$(box).append(html);
}
//設置定時器,開啟彈幕功能
setTimeout(function(){add(content,speed)},startTime);
}
//調用彈幕函數,先使用原生方法獲取盒子
var k = document.getElementsByClassName('div2')[0];
//實例
danmu(k,"我來了1,我來了1,我來了1,我來了1,我來了1,","style",90,0);
danmu(k,"我來了2,我來了2,我來了2,我來了2,我來了2,","style",100,1000);
~~~
- 我的爛筆頭
- 1、常用功能方法整合
- 2、jQuery基本函數
- 3、在頁面中添加圖片
- 4、精度算法
- 5、圖片懶加載
- 6、彈窗拖拽功能
- 7、彈幕功能
- 8、鼠標滾動事件
- 9、獲取頁面相關屬性
- 10、彈窗的三種展現方式
- 11、輪播功能
- 12、獲取唯一標識
- 13、CSS樣式效果
- 14、任意兩點的動態連線
- 15、全新接口功能
- 16、適配兼容
- 17、無刷新頁面更改URL
- 18、定時器的那些事
- 19、關于iframe的常見問題
- 20、設置不同的時間
- 21、關于select-option
- 22、省市級聯
- 23、省市級聯數據
- 24、關于數據傳輸問題
- 25、問題分支
- 那些年我們一起走過的神坑
- 1、關于console的使用
- 2、關于數組
- 1、數組的賦值
- 2、數組的常用方法
- 3、關于移動端的bug
- 4、關于視頻的bug
- 5、那些坑坑洼洼
- 6、關于字符串
- 1、字符串的常用方法
- 頁面布局
- 1、背景固定的滾動頁面
- 心得
- Node.js
- 1、安裝環境
- ThinkPHP 5.1
- 1、訪問格式