Rumah > hujung hadapan web > tutorial js > jQuery Mendatar Padam Fokus Imej Kesan Khas Kod Sharing_jquery

jQuery Mendatar Padam Fokus Imej Kesan Khas Kod Sharing_jquery

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-05-16 15:40:29
asal
1159 orang telah melayarinya

Contoh dalam artikel ini menerangkan kesan khas imej fokus pemadaman mendatar jQuery. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:
Xunlei jQuery Horizontal Erase Focus Image ialah kod imej fokus pemadaman mendatar 7 skrin berdasarkan jQuery Ia mempunyai lakaran kecil dan tajuk, dan tajuk boleh disesuaikan.
Paparan operasi: -------------------Lihat kesan Muat turun kod sumber--------- - --------

Petua: Jika penyemak imbas tidak berfungsi dengan betul, anda boleh cuba menukar mod penyemakan imbas.
(1) Perkenalkan gaya CSS di kawasan kepala:

<link rel="stylesheet" href="css/zzsc.css">
Salin selepas log masuk

(2) Kod js diletakkan di bahagian bawah dokumen:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
 jQuery.noConflict();
 jQuery(document).ready(function($){
 $(".guidelist li").hover(
 function () {
 $(this).attr("class", "mouseon");
  },
  function () {
 $(this).attr("class", "mouseout");
  }
 );
 $(".ftoollist li").mouseover(function(){
 $(this).siblings().removeClass("on");
 $(this).addClass("on");
 var preNumber=$(this).prevAll().size();
 $(".fimglist li").removeClass("onpre");
 $(".fimglist li:nth-child("+preNumber+")").addClass("onpre");
 var margin = 990;
 margin = margin *preNumber; 
 margin = margin * -1;
 $(".fimglist").stop().animate({marginLeft: margin + "px"}, 

{duration: 500});
 });
 });
</script>
Salin selepas log masuk

Kod kesan khas imej fokus pemadam mendatar jQuery yang dikongsi dengan anda adalah seperti berikut



迅雷jQuery横向擦除焦点图
<link rel="stylesheet" href="css/zzsc.css">





<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> jQuery.noConflict(); jQuery(document).ready(function($){ $(".guidelist li").hover( function () { $(this).attr("class", "mouseon"); }, function () { $(this).attr("class", "mouseout"); } ); $(".ftoollist li").mouseover(function(){ $(this).siblings().removeClass("on"); $(this).addClass("on"); var preNumber=$(this).prevAll().size(); $(".fimglist li").removeClass("onpre"); $(".fimglist li:nth-child("+preNumber+")").addClass("onpre"); var margin = 990; margin = margin *preNumber; margin = margin * -1; $(".fimglist").stop().animate({marginLeft: margin + "px"}, {duration: 500}); }); }); </script>
Salin selepas log masuk

Di atas ialah kod kesan khas imej fokus pemadam mendatar Thunder jQuery yang dikongsi dengan anda. Saya harap anda boleh menyukainya dan mengaplikasikannya dalam amalan.

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
Cadangan popular
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan