Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)

Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery

WBOY

Lepaskan： 2016-05-16 15:45:00

asal

1112 orang telah melayarinya

Artikel ini terutamanya memperkenalkan jQuery untuk merealisasikan peta fokus slaid, yang boleh mencapai kesan slaid yang sangat mempesonakan dan bergaya Ia mempunyai nilai praktikal yang hebat dan pada asasnya boleh memuaskan hati anda apabila menggunakan kesan slaid (peta fokus) pada halaman web . Butirannya adalah seperti berikut

Penerangan kesan tayangan slaid: Gunakan tetikus untuk meluncur ke atas butang nombor di penjuru kanan sebelah bawah tayangan slaid untuk bertukar ke kiri dan kanan.

Kesan parameter pensuisan tersuai: suis ke bawah, masa penukaran ialah 8 saat, tukar apabila tetikus meluncur ke atas butang

Tangkapan skrin kesan berjalan adalah seperti berikut:

Kod khusus adalah seperti berikut

<head>

<title>Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery</title>
<script src="js/jquery-1.4a2.min.js" type="text/javascript"></script>
<script src="js/jquery.-1.2.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
 $("#KinSlideshow").KinSlideshow({
 moveStyle:"down",
 intervalTime:8,
 mouseEvent:"mouseover",
 titleFont:{TitleFont_size:14,TitleFont_color:"#FF0000"}
 });
})
</script>
<style type="text/css">
.code{ height:auto; padding:20px; border:1px solid #9EC9FE; background:#ECF3FD;}
.code pre{ font-family:"Courier New";font-size:14px;}
.code pre code.note{ color:#999}
.code2{border:1px solid #FEB0B0; background:#FFF1F1; margin-top:10px;}
.code2 pre{ margin-left:20px; font-size:12px;}
.info{ font-size:12px; color:#666666; font-family:Verdana; margin:20px 0 50px 0;}
.info p{ margin:0; padding:0; line-height:22px; text-indent:40px;}
h2.title{ margin:0; padding:0; margin-top:50px; font-size:18px; font-family:"微软雅黑",Verdana;}
h2.title span.titleInfo{ font-size:12px; color:#333; margin-left:10px;font-family:Verdana;}
h3.title{ font-size:16px; font-family:"微软雅黑",Verdana;}
.importInfo{ font-family:Verdana; font-size:14px;}
</style>

</head>

<body>

<li><h3><a href="demo2.html">自定义切换参数效果</a></h3></li>
</ol>
 <div id="KinSlideshow" style="visibility:hidden;">
  <a target="_blank"><img src="images/11.png" alt="Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery"    style="max-width:90%"  style="max-width:90%" /></a>
  <a target="_blank"><img src="images/23.png" alt="Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery"    style="max-width:90%"  style="max-width:90%" /></a>
  <a target="_blank"><img src="images/22.png" alt="Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery"    style="max-width:90%"  style="max-width:90%" /></a>
  <a target="_blank"><img src="images/5.jpg" alt="Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery"    style="max-width:90%"  style="max-width:90%" /></a>
  <a target="_blank"><img src="images/4.jpg" alt="Perkongsian kod kesan khas tayangan slaid Jquery--tukar apabila tetikus meluncur ke atas butang (2)_jquery"    style="max-width:90%"  style="max-width:90%" /></a>
 </div>

</body>
</html>

Salin selepas log masuk

Saya harap artikel ini akan membantu reka bentuk kesan khas Jquery semua orang.