分享一个jQuery iframe 弹窗插件Boxen

1.引用文件:

<link href="jquery.boxen.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.boxen-1.4.min.js"></script>

2.调用方式:

<a href="#" id="google">google</a>
<a href="http://www.baidu.com" id="baidu">baidu</a>
<script type="text/javascript">
$(
function(){
$(
"#google").click(function(){
$.Boxen.open(window,{url:
"http://www.google.com",width:650,height:300,title:'Google 主页',modal:true});
});
$(
"#baidu").boxen();
});
</script>

3.参数说明:

       //默认参数配置
        defaults: {
            urlParams: {},
            showTitleBar: true,    //是否显示TitleBar
            showCloseButton: true, //是否显示关闭按钮
            title: null,  //标题
            titleAttribute: 'title',
            closeButtonText: 'X',
            width: 600,
            height: 380,
            url: null,
            urlAttribute: 'href',
            overlayOpacity: 0.4,  //遮罩层透明度
            overlayColor: null,
            modal: false,   //是否为模态窗口
            postOpen: function(contentAreaElement) {},
            postClose: function() {}
        }

4.下载:jQuery boxen 插件

posted @ 2011-04-30 17:55  code_flyer  阅读(1098)  评论(0编辑  收藏  举报