• Connect_logo_6.png 退出
    前端视?#21040;?#31243; 小程序 众筹源码 python 商城源码 商城模板 响应式模板 中文模板 手机模板 企业源码
    充值

    jQuery点击图片相册掀开切换效果

    作者/代码整理:  (转载请附加本文地址,带?#23567;?#25042;人原生”字样的谢绝转载) 发布日期:2017-10-24
    这是一款鼠标点击图片自动切换到下一张特效,漂亮的jQuery点击图片相册掀开切换效果。


    js代码

    <script type="text/javascript">
    $(function(){   
    		  
    	var interval;
    	$(".container img").click(function cover(){
    			$(this).addClass("zoom").fadeOut(700,append);		
    			function append(){
    			$(this).removeClass("zoom").appendTo(".container").show();
    			var name = $(".container").children("img").first().attr("alt");
    			 $(".name p").text("No "+name);
    			}	
    	  
    	})
    	
    	function auto(){
    			var play = $(".container").children("img").first();
    			play.addClass("zoom").fadeOut(700,append);		
    			function append(){
    			$(this).removeClass("zoom").appendTo(".container").show();
    			var name = $(this).parent().children("img").first().attr("alt");
    			 $(".name p").text("No "+name);
    			}
    			interval = setTimeout(auto,5000);
    	}
    	
    	$(".container img").hover(function(){
    			stopPlay();
    	},function(){
    			interval = setTimeout(auto,5000);
    	})
    	
    	function stopPlay(){
    		clearTimeout(interval)
    	}
    	auto();
    					
    })
    </script>
    

    北京11选5app下载