前段時間有網(wǎng)友在本站留言，對鼠標經(jīng)過淡入淡出層的效果非常感興趣，所以應網(wǎng)友的興趣，小編特地寫一篇技術分享的文章，分享一下這種簡單的效果是如何實現(xiàn)的。
jquery是目前非常流行也是使用的非常多的一種效果代碼，jquery的基本應用也是非常簡單的，她可以實現(xiàn)非常多的酷炫效果，并且只需要加載jquery庫，幾行非常簡單的效果就能夠?qū)崿F(xiàn)了。

下面，我們就介紹一下常用的jquery效果，這些效果都是在網(wǎng)頁設計中非常實用并且常見的。使用這些簡單的效果，可以讓你的wordpress網(wǎng)站更加的酷炫同時兼容性更加的好！

淡入淡出的:hover效果。
對于：hover? 相信了解前端基本知識的朋友都會知道，CSS的hover效果是非常直接變化，有時候會讓我們覺得有些生硬，使用簡單的一句jquery，便能夠非擦酷炫的使hover的效果變成淡入淡出的形式，并且對IE6的hover?? bug（不支持a標簽以外的hover）有非常好的兼容。

首先你需要了解的是CSS種的定位（position）? 絕對定位（absolute）和相對定位（relative），使用jquery做hover的效果并不是CSS中真正的hover效果，而是使用定位（position）和層級z-index 在你想要發(fā)生變化的層上面加上一個變化的效果層，并使用顯示方式（display）隱藏這個層，當鼠標經(jīng)過這個層的時候，變化的層就使用淡入淡出的方式顯示出來。html和CSS如下圖：

jquery部分：

$('#fuji').hover(? //輸入父級標簽CSS名稱或 ID

function() {
$(this).children('.ziji').stop(true, true).fadeIn('1000');
},//輸入子級標簽CSS名稱或 ID，鼠標移入淡入顯示

function() {
$(this).children('ziji').stop(true, true).fadeOut('1000');
}).click (function () {
//輸入子級標簽CSS名稱或 ID，鼠標移出淡出消失

});

這里 你只需要填寫id CSS名稱 查找到父級的容器，然后在查找子級的id或css

id? 書寫方式? #id名稱??? CSS 書寫方式 .CSS名稱

查找被變化的不止是子級，可以是任何的標簽，范例中是children，也就是查找子級,還有更多的方式可以參考jquery的手冊。? 不同的動畫形式，不同的查找方法，和刪除添加元素等，都有詳細介紹。

文章寫得可能不是很詳細，請下載文件，有詳細注釋，看看文件可能更加的容易理解了！

了解了jquery的簡單運用模式，你可以參閱jquery手冊，舉一反三，做出更多形式更多效果的酷炫網(wǎng)頁了！

附件：簡單運用的jquery