效果圖如下:
只需要在js中加入如下**,同時在頁面中引入js所在路徑。
/**
* license: mit
* version: v1.0.1
* github:
**/!
function
() function
e(n)
function
t()
}function
o()
function
i() ),
x(i)
}var a, c, u, m = document.createelement("canvas"),
d = t(),
l = "c_n" + d.l,
r = m.getcontext("2d"),
x = window.requestanimationframe || window.webkitrequestanimationframe || window.mozrequestanimationframe || window.orequestanimationframe || window.msrequestanimationframe ||
function
(n) ,
w = math.random,
y = ;
m.id = l,
m.style.csstext = "position:fixed;top:0;left:0;z-index:" + d.z + ";opacity:" + d.o,
o(),
window.onresize = o,
window.onmousemove = function
(n) ,
window.onmouseout = function
() ;
for (var s = , f = 0; d.n > f; f++) )
}u = s.concat([y]),
settimeout(function
() ,
100)
} ();
例如:用bootstrap框架,在js資料夾下的bootstrap.min.js內將上面的**複製進入就可。運用時,在html的body部引入**:
lang="en">
charset="utf-8">
documenttitle>
head>
jQuery的動態效果效果演示
jquery做動態效果,可以使用animate函式,animate params duration easing callback 用於建立自定義動畫的函式。這個函式的關鍵在於指定動畫形式及結果樣式屬性物件。這個物件中每個屬性都表示乙個可以變化的樣式屬性 如 height top 或 opacity...
css3 html滑鼠劃入動態效果 二
效果圖 w3layouts gallery grid1 pos 激情,滿意,精益求精 w3layouts gallery grid1 pos 激情,滿意,精益求精 w3layouts gallery grid1 pos 激情,滿意,精益求精 w3layouts gallery grid1 pos 激...
為網頁的進入或退出設定不同的動態效果
開啟網頁源 若你想實現網頁以垂直百葉窗的方式開啟,可以在源 的 head 與 head 之間加入如下語句 duration 的值為網頁動態過渡的時間,單位為秒,一般設為3 5秒即可。transition 不同的值對應不同的過渡方式,共有24種方式可供選擇 0 盒狀收縮 1 盒狀放射 2 圓形收縮 3...