jQuery点击弹出层带关闭按钮的淡出淡进滑动弹出层效果



142 566 189



特效描述:点击弹出层 关闭按钮 淡出淡进 滑动弹出层,

代码结构

1. 引入JS

<script type="text/javascript" src="js/jquery.1.7.2.min.js"></script>

2. HTML代码

<div class="btn_content">
	<button style="float:left" id="open">弹出</button>
	<button style="float:left" id="close">折叠</button>
</div><!--btn_content end-->
<div class="PopupLayer">
	<a class="close" href="javascript:void(0);"></a>
	<p> 比尔盖茨发现你正在用IE浏览器,紧紧握住您的手,使劲儿的那个摇。 <br />
	拉里▪佩吉发现您正在用IE浏览器,耸了一下肩,摇头笑笑。 <br />
	乔布斯发现您正在用IE浏览器,打算从天国下来和你聊聊。 <br />
	我们发现您正在用IE浏览器,打算给您点建议: <span>亲!在下面挑一个新款浏览器升级吧!</span> </p>
	<ul>
		<li><a href="https://www.17sucai.com/" title="下载谷歌浏览器"><img src="images/chrome.jpg" /></a></li>
		<li><a href="http://www.17sucai.com/" title="下载火狐浏览器"><img src="images/firefox.jpg" /></a></li>
		<li><a href="http://www.17sucai.com/" title="下载Safair浏览器"><img src="images/safair.jpg" /></a></li>
		<li><a href="http://www.17sucai.com/" title="下载Opera浏览器"><img src="images/opera.jpg" /></a></li>
		<li><a href="http://www.17sucai.com/" title="下载IE9浏览器"><img src="images/ie9.jpg" /></a></li>
	</ul>
	<a class="btn" href="javascript:void(0);">我知道了</a>
</div><!--PopupLayer end-->



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


热门标签: 滑动滑过 切换按钮 form表单 图片滑动 按钮控制

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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