今天給大家分享一款基於jquery固定於頂部的導航，這款導航當瀏覽器滾動條位於頂部時，導航高度較高，當瀏覽器滾動向下滾動時，導航高度自動減低，並位於頂部。效果圖如下：
實現的**：
html**：
<css**：div
id="page"
>
<
div
id="*******"
data-0
="height:192px"
data-128
="height: 64px"
>
<
div
id="actions"
>
<
div
class
="icon"
>
<
svg
viewbox
="0 0 24 24"
x="0px"
y="0px"
version
="1.1"
xmlns
=""xmlns:xlink
="">
<
g id
="menu"
>
<
path
d="m3,18h18v-2h3v18z m3,13h18v-2h3v13z m3,6v2h18v6h3z"
>
path
>
g>
svg>
div>
<
div
class
="spacer"
>
div>
<
div
class
="icon"
>
<
svg
viewbox
="0 0 24 24"
x="0px"
y="0px"
version
="1.1"
xmlns
=""xmlns:xlink
="">
<
g id
="search"
>
<
path
d="m15.5,14h-0.8l-0.3-0.3c1-1.1,1.6-2.6,1.6-4.2c16,5.9,13.1,3,9.5,3c5.9,3,3,5.9,3,9.5s5.9,16,9.5,16c1.6,0,3.1-0.6,4.2-1.6l0.3,0.3v0.8l5,5l1.5-1.5l15.5,14z m9.5,14c7,14,5,12,5,9.5s7,5,9.5,5c12,5,14,7,14,9.5s12,14,9.5,14z"
>
path
>
g>
svg>
div>
<
div
class
="icon"
>
<
svg
viewbox
="0 0 24 24"
x="0px"
y="0px"
version
="1.1"
xmlns
=""xmlns:xlink
="">
<
g id
="more-vert"
>
<
path
d="m12,8c1.1,0,2-0.9,2-2s-0.9-2-2-2c-1.1,0-2,0.9-2,2s10.9,8,12,8z m12,10c-1.1,0-2,0.9-2,2s0.9,2,2,2c1.1,0,2-0.9,2-2s13.1,10,12,10z m12,16c-1.1,0-2,0.9-2,2s0.9,2,2,2c1.1,0,2-0.9,2-2s13.1,16,12,16z"
>
path
>
g>
svg>
div>
div>
<
div
id="title"
data-0
="font-size: 48px; padding: 0 0 24px 12px;"
data-128
="font-size: 18px; padding: 0 0 21px 60px;"
>
page title
div>
div>
<
div
id="content"
data-0
="padding-top: 192px;"
data-192
="padding-top: 190px;"
>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
<
div
class
="card"
>
content goes here!
div>
div>
div>
<
script
src='jquery.js'
>
script
>
<
script
src='skrollr.min.js'
>
script
>
<
script
>
$(document).ready(
function
() );
});
//@ sourceurl=pen.js
script
>
html, body #page #******* #actions #actions .icon #actions .spacer #actions svg #title #content .card
分享一款基於jquery的圓形動畫按鈕
之前為大家介紹過一款純css3實現的圓形旋轉分享按鈕。今天要給大家帶來一款基於jquery的圓形動畫按鈕。這款按鈕滑鼠經過的時候以邊框轉圈，然後逐漸訊息，在例項中給出了四種顏色的demo。效果圖如下 實現的 html figure class red div class icon idiv div ...
一款基於jquery和css3的頭像惡搞特效
今天給大家分享一款基於jquery和css3的頭像惡搞特效。這款例項中，乙個頭像在畫面中跳舞，頭像還有可愛的帽子，單擊下面的按鈕可以為頭像切換不同的帽子。效果圖如下 實現的 html html div div div div div div div div div div div div div h...
分享一款jQuery的UI外掛程式 Ninja UI
今天分享一款jquery的ui外掛程式 ninja ui 這個外掛程式使用jquery本身的語法來開發介面元素，而且你不需要關注css樣式相關設定，因為整個css樣式都被直接寫到了外掛程式中，不過壞處是，你需要 在開發前就確定好css，同時目前提供倆個型別的主題。外掛程式使用簡單，如果你會寫jque...