Fancybox具有很强大的功能,它可以加载DIV,图片、图片集、Ajax数据,还能加载SWF影片,iframe页面等等。本文讲演示七种弹出层示例。
[img]http://www.sucaihuo.com/jquery/demo/45/images/demo.jpg[/img]
我们先演示第一种[b]超炫的弹出层效果[/b],看了以后,其他神马弹出层弱爆了
HTML:
Jquery:
最后调用Fancybox插件方法:
Fancybox演示地址:[url]http://www.sucaihuo.com/js/45.html[/url] :idea: :idea: :idea:
[img]http://www.sucaihuo.com/jquery/demo/45/images/demo.jpg[/img]
我们先演示第一种[b]超炫的弹出层效果[/b],看了以后,其他神马弹出层弱爆了
HTML:
<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>
Jquery:
最后调用Fancybox插件方法:
$("#demo1").fancybox({
'transitionIn': 'elastic', //窗口显示的方式
'transitionOut': 'elastic',
'titlePosition': 'inside'
});
Fancybox演示地址:[url]http://www.sucaihuo.com/js/45.html[/url] :idea: :idea: :idea: