如圖,有五個元素,給他們都加上運動效果。
實現原理,就是在呼叫的時候,給這五個元素,迴圈加上事件。需要注意的是,每個元素的定時器需要分開。
要點一:
var speed = (target - obj.offsetwidth)/8; 緩衝運動效果,一開始速度很快,然後越來越慢,直到停止
speed = speed>0?math.ceil(speed):math.floor(speed); 如果速度大於0,則向上取整,如果速度小於0,則向下取整。
要點二:
if(obj.offsetwidth == target)else
元素寬度和目標值比較,如果相等,關閉定時器,否則,寬度繼續增加。
要點三:
for(i=0; i給每個元素加上各自的定時器屬性,各自的滑鼠事件,在滑鼠事件中呼叫運動函式。
最後,上**:
>無標題文件
title
>
<
style
>
body,ul,li
#runs li
style
>
<
script
>
window.onload
=function
()runs_li[i].onmouseout
=function()}
}function
startrun(obj,target)
else
document.title
=obj.offsetwidth +'
,'+target;
},30);}
script
>
head
>
<
body
>
<
ul id
="runs"
>
<
li style
="top:0"
>1
li>
<
li style
="top:90px;"
>2
li>
<
li style
="top:180px;"
>3
li>
<
li style
="top:270px;"
>4
li>
<
li style
="top:360px;"
>5
li>
ul>
body
>
html
>
同一頁面載入多個ztree
最近專案要在同乙個頁面載入 多個ztree做不同分類的選擇 看了看官方文件,決定從select checkbox menu入手 觸發 跟值返回 ztree初始化成功後的treeid 是容納資料的容器的id 比如下面的edu type 資源格式ztree 初始化的id js var setting v...
同一頁面多個swiper出現錯亂問題
第一次使用swiper出現的各種奇葩問題 1.同一頁面存在多個swiper時,不能以通用的id或者class為定位標準,容易出現同時找到多個物件的問題,需要確保id和class的唯一性 專案案例 產線屏 電子展板與人員績效多個tab來回切換時,電子展板初始化後,可以正常上下頁切換重新整理 從人員績效...
frame 同一頁面之間的框架操作
frame元素可以讓我們在一張網頁中顯示不同html檔案的內容,有些時候我們需要在乙個frame中新增鏈結,並使用這些鏈結來控制另乙個frame的內容,當然,這個過程可以使用js指令碼來控制,那麼如何使用最簡單的html來實現這一目標呢,其實我們只需要了解frame的乙個屬性 name 就可以了,並...