Contoh dalam artikel ini menerangkan cara jQuery melaksanakan kesan animasi gelongsor tetikus sensitif menu. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:
Persekitaran ujian untuk kod ini ialah penyemak imbas IE9 dan GG dan FF dan di bawah mungkin tidak menyokongnya.
Kesan gelongsor tetikus JS ini menggunakan jQuery untuk mencapai animasi ringkas, dan saya terkejut apabila mendapati jquery mempunyai kaedah penulisan yang lebih baik, yang boleh ditulis secara berterusan sebelum kaedah animasi dapat menyedarinya selepas tetikus dialih keluar, tidak Kemudian lakukan kesan gelongsor.
Kesan gelongsor tetikus jQuery yang sangat baik
badan{font-size:12px;font-family:Tahoma,Arial,Verdana;color:#fff;latar belakang:#000:100%;
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pra,form,fieldset,input,textarea,p,blockquote,th,td ,i{padding: 0;margin:0}
set medan,img {sempadan:0}
.jelas{ jelas:keduanya;}
alamat, kapsyen, petikan, kod, dfn, em, ke, var {font-weight:normal;font-style:normal}
ol,ul {list-style:none}
kapsyen, ke {text-align:left}
h1,h2,h3,h4,h5,h6 {saiz fon:100%}
abbr,akronim,img {sempadan:0}
butang,input,pilih,textarea{font-size:100%;}
input,butang,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
jadual {border-collapse:collapse;border-spacing:0;}
a{text-decoration:none;}
a:hover {text-decoration:underline;}
.clearfix:selepas {visibility: hidden;display: block;font-size: 0;content: ".";clear:both;}
.semua ul{ lebar:100%; text-align:center;}
.semua ul li{ lebar:100%; ketinggian:40px;
- Item pertama
- Item kedua
- Item ketiga