jQuery教學－浮動式固定上選單:－2016韓國代購網 , 韓國代購化妝品 , 韓國代購批發 , 韓國代購教學---韓國代購/追加/寄貨

Blogtrottr

♣梅問題‧教學網【Minwt】♣

How to Make, Market, and Sell eBooks

Essential and free e-publishing methods to market ebooks at major retailers and personal sites/blogs. Sign up for this online course for just $29.

From our sponsors

jQuery教學－浮動式固定上選單

Aug 16th 2013, 01:30, by admin

　　每當在瀏覽網頁時，由於網頁內容很長，就會不斷的向下滾動，比較貼心的網站，會提供Top鈕，讓使用者可以快速置頂，再去瀏覽其它主題的內容，除此之外也有些網站，當頁面滾動超過一定的範圍後，上面的選單就會固定在上方，讓使用者可以不用滾動與置頂，就能透過上方的選單，快速的跳到其它主題中，除此之外這種固定式選單，也可加深網友對網站的印象，而這個看似很酷的浮動式固定選單，其實作法相當的簡單喔！梅干花了點時間將它簡化，讓各位可以無痛的套用，現在就一塊來看看。

CSS樣式：
放在<head>.....</head>之間：
#top-bar{ width:100%; height:50px; background:#32b3bf; position:fixed; top:-65px; /* CSS3 陰影*/ -webkit-box-shadow: 0px 8px 15px #333; -moz-box-shadow: 0px 8px 15px #333; box-shadow: 0px 8px 15px #333; }

Javascript：
放在<head>.....</head>之間：
這邊梅干是設定當滾動超過100像素時，上面選單就滑出，若要再多一點的話，可自行修改this_Top中的數值，若要改變上選單高度時，再修改top:後方的數值即可。

HTML：
放在<body>.....</body>之間：

[ 範例預覽 ] | [ 範例下載 ]

分享給更多朋友 分享

This entry passed through the Full-Text RSS service — if this is your content and you're reading it on someone else's site, please read the FAQ at fivefilters.org/content-only/faq.php#publishers. Five Filters recommends: 'You Say What You Like, Because They Like What You Say' - http://www.medialens.org/index.php/alerts/alert-archive/alerts-2013/731-you-say-what-you-like-because-they-like-what-you-say.html

You are receiving this email because you subscribed to this feed at blogtrottr.com.

If you no longer wish to receive these emails, you can unsubscribe from this feed, or manage all your subscriptions