masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > jQuery 渐变下拉菜单_jquery

jQuery 渐变下拉菜单_jquery

WBOY
Lepaskan： 2016-05-16 18:39:06
asal
972 orang telah melayarinya

这里主要是利目标在鼠标经过时（.hover()）利用slideToggle() 、slideUp()来显示原来隐藏着的内容：

复制代码 代码如下:

$(function(){
$(".dropdown").hover(
function(){ $("li ul").slideToggle(800);},
function(){$("li ul").slideUp(1000)}
)
})

jQuery 渐变下拉菜单_jquery
复制代码 代码如下:





jQuery 渐变下来效果







    

jQuery 渐变下拉菜单


使用slideToggle和slideUp来实现.当然,也可以使用hide/show, fadeIn/fadeOut等来实现,只是效果不同,实现的方法还是相同的.需要注意的是,要给.dropdown加上position:relative;防止闪烁.









测试代码打包下载
Label berkaitan：
menu lungsur turun Kecerunan
sumber：php.cn
Artikel sebelumnya：Javascript attachEvent传递参数的办法_javascript技巧 Artikel seterusnya：javascript获取元素文本内容的通用函数_javascript技巧
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?
daripada 2024-04-23 00:22:19
0
9
1588
Apakah format pembolehubah dalam nilai pulangan? Saya seorang pelajar baru php. Saya menjumpai sekeping kod: if($x<time()){return[false,...
daripada 2024-04-06 21:55:20
0
1
778
Ubah suai gaya CSS sebaris secara dinamik dalam Javafx Saya cuba menukar imej latar belakang anak tetingkap apabila aplikasi dimaksimumkan. Latar...
daripada 2024-04-06 20:57:16
0
1
487
MySQL: "Pilih teks daripada... sebagai <variable here or subquery>" Saya mempunyai jadual berikut dengan data berikut: id text language 1 german text german 2...
daripada 2024-04-06 19:25:54
0
2
529
Menggunakan pembolehubah yang ditakrifkan dalam kaedah dalam templat Ini adalah kali pertama saya menggunakan Vue (v2 bukan v3) dan saya telah cuba menggunakan...
daripada 2024-04-06 18:10:25
0
2
513
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan