jquery穿梭式滑动风格幻灯片_图片代码_图片滑动_自适应_穿梭式滑动幻灯片

这是一款穿梭式滑动风格幻灯片插件，可以自动根据显示屏大小调节图片大小。

淘建站为您提供更多_图片代码_图片滑动_自适应_穿梭式滑动幻灯片，在此特别感谢您对我们的支持与厚爱！

查看演示

演示不了，点击反馈

加入收藏

下载 87 次

下载资源

13 积分

特别说明：本站资源来自网友发布分享，仅供学习与参考，请勿用于商业用途，若有侵权请联系删除(272966172@qq.com)。

举报/反馈

分类：图片代码 > 图片滑动难易程度：中级

载入插件

<link href="css/features.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
//自设定
var portfolioJSON = [
	{"2":"#dddddd"},
	{"2":"#FFDC33"},
	{"2":"#FFFFFF"},
	{"2":"#669900"},
	{"2":"#304B89"}
];
var featuresTimer;
var hoverTimer;
</script>
<script type="text/javascript" src="js/features.js"></script>

html

<div id="features-container">
	<div id="glow-container">
		<div id="glow-color-active" style="background-color:#ddd"></div>
		<img id="glow-fg" src="images/glow-fg.png" />
	</div>
	
	<div class="frame-smaller-outer left">
		<div class="frame-smaller-inner">
			<div class="slider">
				<img src='images/selfservice11.jpg' />
				<img src='images/portfolio1.jpg' />
				<img src='images/mothers.jpg' />
			</div>
		</div>
	</div>
	
	<div class="frame-smaller-outer right">
		<div class="frame-smaller-inner">
			<div class="slider">
				<img src='images/selfservice11.jpg' />
				<img src='images/portfolio1.jpg' />
				<img src='images/mothers.jpg' />
			</div>
		</div>
	</div>
	
	<img id="frame-center-shadow" src="images/frame-shadow.png" />
	
	<div id="frame-center-outer">
		<div id="frame-center-inner">
			<div class="slider">
				<a href='http://www.sucaiq.com'>
					<span class='title'></span>
					<span class='more'>查看更多</span>
					<span class='image-holder'><img src='images/selfservice11.jpg' /></span>
				</a>
				<a href='http://www.sucaiq.com/'>
					<span class='title'></span>
					<span class='more'>查看更多>></span>
					<span class='image-holder'><img src='images/portfolio1.jpg' /></span>
				</a>
				<a href='http://www.sucaiq.com/'>
					<span class='title'></span>
					<span class='more'>查看更多>></span>
					<span class='image-holder'><img src='images/mothers.jpg' /></span>
				</a>
				
			</div>
		</div>
	</div>
	
	<div class="nav-arrow back"></div>
	<div class="nav-arrow next"></div>
	
</div>