基於jquery自己寫滑動門 通用版

今天與大家分享一下，自己寫的滑動門。在網上也搜尋了一下，沒發現比較好的，於是乎自己寫一吧~寫起來也很簡單，為了方便使用，我已經盡量封裝好了。好吧，閒話少說，直接上**吧......

css:

.main

.main_top
.main_top ul
.main_top ul li.h_qian
.main_top ul li.h_hou
.main_content

js:

function

tabchange(obj,p,c,q,h)

html:

<

div 
class
="main"
>
<
div 
class
="main_top"
>
<
ul>
<
li class
="h_hou"
onmouseover
="tabchange(this,'main','main_content','h_qian','h_hou')"
>第一模組
li>
<
li class
="h_qian"
onmouseover
="tabchange(this,'main','main_content','h_qian','h_hou')"
>第二模組
li>
<
li class
="h_qian"
onmouseover
="tabchange(this,'main','main_content','h_qian','h_hou')"
>第三模組
li>
ul>
div>
<
div 
class
="main_content"
>
第1塊        
div>
<
div 
class
="main_content"
style
="display:none;"
>
第2塊        
div>
<
div 
class
="main_content"
style
="display:none;"
>
第3塊        
div>
div>

**很簡單，不多說了，詳細使用方法請參照demo中tangtab.js裡的注釋。

附：demo

ps：tandy tang祝大家寫**寫的愉快！

CSS滑動門技術

製作網頁時,為了美觀,會製作設定特殊形狀的背景,裡面的字數不一樣,為了使各種特殊形狀能夠自適應元素中文字內容的多少,出現了css滑動門技術.是各種特殊形狀的背景能夠根據文字內容的多少拉伸滑動,可用性更強.最常見的是各種導航欄的滑動門.使用精靈技術 主要是背景位置 和padding撐開盒子,找一很長的...

css滑動門技術

為了使各種特殊形狀的背景能夠自適應元素中文字內容的多少，出現了css滑動門技術。使各種特殊形狀的背景能夠自由拉伸滑動，以適應元素內部的文字內容，可用性更強。最常見於各種導航欄的滑動門。工作原理 滑動門技術的關鍵主要在於拼接，利用css精靈sprite 主要是背景位置position 和盒子paddi...

滑動門 css陰影效果

css陰影效果 drop shadows 一點陰影可以給平板的設計增加縱深的感覺,很多時候我們都是直接用photoshop直接製作帶陰影的以供使用,這裡介紹的是一種不需要修改,而只需要用css完成的技巧.網頁教學網 原理 給 備用的陰影影象 shadow.gif html 如下 網頁教學網 css ...