7款超炫的弹出层效果Fancybox

浏览:2394 发布日期:2015/04/12 分类:用法示例 关键字: 弹出层 网页特效 js特效 jQuery特效
Fancybox具有很强大的功能,它可以加载DIV,图片、图片集、Ajax数据,还能加载SWF影片,iframe页面等等。本文讲演示七种弹出层示例。


若是想看更多js特效网站源码 js教程请访问 http://www.sucaihuo.com/js 还有演示DEMO,最主要是可以免费下载。1、
首先引入jQuery库和Fancybox插件。
<link rel="stylesheet" type="text/css" href="fancybox.css" />  
<script type="text/javascript" src="jquery.js"></script>  
<script type="text/javascript" src="jquery.fancybox-1.3.1.pack.js"></script>
2、
我们先演示第一种超炫的弹出层效果,看了以后,其他神马弹出层弱爆了...哈哈...其他强大的Fancybox弹出演示效果DEMO里有,请点击查看演示效果http://www.sucaihuo.com/jquery/demo/45/
<h4>演示1:动态效果</h4> 
<p><a id="demo1" href="images/example/b1.jpg" title="Hello,this is a fancybox."><img src="images/example/s1.gif" alt="" /></a></p>
3、
最后调用Fancybox插件方法:
$("#demo1").fancybox({ 
   'transitionIn': 'elastic', //窗口显示的方式 
   'transitionOut': 'elastic', 
   'titlePosition': 'inside' 
});
查看该特效演示及免费下载,请访问 http://www.sucaihuo.com/js/45.html
评论( 相关
后面还有条评论,点击查看>>