jQuery全屏自适应图片切换和放大缩小代码

查看演示 下载资源 下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.3.js"></script>
<script type="text/javascript" src="js/e-smart-zoom-jquery.min.js"></script>
<script type="text/javascript">
	function resize(){
		$("div.zoom,div.zoombtn").width($(window).width());
		$("div.zoom,div.zoomlist,.list,.imgContainer").height($(window).height());
		$("div.zoomlist,.tempWrap,.imgContainer").width($(window).width()-80);
	};
	$(window).resize(function(){resize()});
	$(function(){
		resize();
		jQuery(".zoom").slide({mainCell:".zoomlist .list",prevCell:".prev",nextCell:".next",effect:"fade",scroll:1,vis:1});
		
		$('img#imageFullScreen_1').smartZoom({'containerClass':'zoomableContainer'});
        var listlength=$(".list .zoombd").length+1;
		var linshi=1;
		function nexta(){
			linshi = linshi+1;
			if(linshi<=listlength){
				$("img#imageFullScreen_"+linshi).smartZoom({'containerClass':'zoomableContainer'});
			}else{
				linshi--;
			 	$("img#imageFullScreen_"+linshi).smartZoom({'containerClass':'zoomableContainer'});
			}	
		};
		function preva(){
			linshi = linshi-1;
			linshi=Math.abs(linshi);
			if(linshi==0){
				linshi=6;
				$("img#imageFullScreen_"+linshi).smartZoom({'containerClass':'zoomableContainer'});
			}else{
				$("img#imageFullScreen_"+linshi).smartZoom({'containerClass':'zoomableContainer'});    
			}	
		};
		$(".next").click(function(){nexta()});
		$(".prev").click(function(){preva()});	
	});
	

</script>