jquery ui accordion手风琴插件带动画的竖直手风琴上下伸缩展开



116 460 154



特效描述:手风琴插件 动画竖直手风琴 上下伸缩展开,

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/styles.css" type="text/css" />

2. 引入JS

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>

3. HTML代码

<ul class="services-list">
	<li>
		<h2><a href="#" title="">CSS3+PIE圆角插件实现超酷的导航菜单和按钮</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此作品是一款可以帮助网友们美化菜单和按钮,跟丑陋的、传统的菜单和按钮说88,默认整理了4种主题颜色,网友们可以自己无限添加哦,主要用了CSS3+PIE圆角插件实现,这样就可以兼容所有浏览器啦,菜单和按钮的长度都是自适应。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Monitoreo" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title=""><strong>带动画全屏图文切换+键盘控制的Jquery焦点图</strong></a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此Jquery特效是一款效果非常酷的图片轮播,它包括了以下功能<br />1、带动画效果<br />2、全屏轮播<br />3、轮播内容由图文切换<br />4、键盘左右方向键控制左右滚动<br />5、背景跟随切换<br />6、自动播放。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Alarmas y c&aacute;maras" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title="">网友康松分享仿Win8布局+lightbox弹出层插件显示页面</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此作品是仿Win8布局+lightbox弹出层Jquery插件实现的,它把整个网站的功能都在这个布局里面展示,点击的时候以弹出层的方式来显示页面,这样就可以减少了繁琐的跳转页面操作,提高了用户体验,是一种最近比较流行的网页布局,网友们好好利用哦。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Protecci&oacute;n perimetral" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title="">一款带3D效果带略缩图的幻灯片Jquery插件</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此Jquery插件一款带3D效果带略缩图的幻灯片效果,功能非常强大,默认带有3种皮肤,用法也很简单,可以灵活设置6个参数,1、skin:皮肤目录设置,包括3个(cool,crazy,simple)2、numberOfThumbsPerScreen:略缩图的滚动个数,默认为7个。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Consorcios" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title="">网友Kevin分享原创图片滚动Jquery插件kevinScroll</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>首先非常感谢网友Kevin的无私分享,此Jquery插件实现图片滚动功能,这是他写的一款原创作品,插件命名为kevinScroll,现在分享的是V1.0版本,还在不断完善中,插件功能非常强大,可以灵活设置7个参数,页面上可以多次调用都不起冲突。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Protecci&oacute;n de personas" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title="">一款国外的四图轮播幻灯片Jquery插件</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此Jquery插件是一款国外的四图轮播幻灯片,功能不是很复杂,非常实用,图片使用跟平时的焦点图的用法有点不同,它的图片不放到主体里面,通通都作为背景图片使用,主体就用文字来描述,包含了图片播放、图片滑动、图片左右轮播。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Auditor&iacute;as" /></div>
			</div>
		</div>
	</li>
	<li>
		<h2><a href="#" title="">原生js实现3维图片里外转动放大缩小特效</a></h2>
		<div>
			<div class="service-content">
				<div class="service-info-text">
					<p>此js特效实现3维图片里外转动放大缩小功能,是一款效果非常酷的作品,作为图片轮播特效来讲,它算比较新有创意的啦,包含了图片滚动、图片放大、图片缩小、鼠标悬浮事件等功能。。。</p>
				</div>
				<div class="service-info-image"><img src="img/services/service-07.jpg" alt="Desarrollos a medida" /></div>
			</div>
		</div>
	</li>
</ul>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滑动 滑块 滑动门 触屏滑动 滑动插件 滑块插件 加载动画 滑动选项卡 滑动切换 滚动切换 滚动条切换 flash焦点图 flash幻灯片 flashbanner flash图片轮播 滑动手风琴 选项卡切换 选项卡 切换 tab切换 页面切换 选项卡插件 切换插件 收缩展开 展开收缩 收缩 展开 h5弹窗动画 html5弹窗动画 h5动画 h5背景动画 h5场景动画 h53D动画 h5界面动画 html5动画 焦点图 幻灯片 轮播图 bar焦点图 h5按钮动画 html5按钮动画 收缩菜单 收缩导航 h5图片动画 h5图标动画 html5图片动画 html5图标动画 带简介的焦点图 文字切换 文字选项卡 滑动手风琴

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到