jquery弹出层特效制作一个类似flash动画效果的弹出层特效,鼠标点击按钮弹出一个带动画animate效果的浮动弹出层。jquery下载。
载入js
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".showdiv").click(function(){
var box =300;
var th= $(window).scrollTop()+$(window).height()/1.6-box;
var h =document.body.clientHeight;
var rw =$(window).width()/2-box;
$(".showbox").animate({top:th,opacity:'show',width:600,height:340,right:rw},500);
$("body").prepend("<div class='mask'></div>");
$(".mask").css({opacity:"0.5"}).css("height",h);
return false;
});
$(".showbox .close").click(function(){
$(this).parents(".showbox").animate({top:0,opacity: 'hide',width:0,height:0,right:0},500);
$(".mask").fadeOut("fast");
});
});
</script>
html
<div class="showbox"> <h2>jquery 浮动层、弹出层<a class="close" href="#">关闭</a></h2> <div class="mainlist"> <ul> <li><span>▪</span><a href="http://www.sucaihuo.com/" target="_blank">用jquery特效制作左侧侧边浮动导航菜单滑动显示或隐藏</a></li> <li><span>▪</span><a href="http://www.sucaihuo.com/" target="_blank">jquery 弹出层 点击按钮弹出层兼容IE和firefox浏览器</a></li> </ul> </div> </div>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791