bootstrap 弹出包含iframe模态窗口的修改

来源:互联网 发布:网络授课教师招聘 编辑:程序博客网 时间:2024/06/03 01:57
HTML:

<!-- 模态框(Modal) -->
<div class="modal fade" id="NoPermissionModal">
    <div class="modal-dialog" >
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close"
               data-dismiss="modal" aria-hidden="true">
                  &times;
            </button>
            <h4 class="modal-title" id="myModalLabel">
               统计图
            </h4>
         </div>
            <div class="modal-body">
                <iframe id="NoPermissioniframe" width="100%" height="100%" frameborder="0" ></iframe>
            </div>
        </div>
    </div>
</div>

js:

//弹出统计图表方法
  ///frameSrc:url地址,otitle:标题,cssobj:弹出框大小样式设置 默认800*620,cssifm:iframe样式
  function showtip(frameSrc,otitle,cssobj,cssifm){
        $("#NoPermissioniframe").attr("src", frameSrc);
        $('#NoPermissionModal').modal({ show: true, backdrop: 'static' });
        var _scrollHeight = $(document).scrollTop();
        var wHeight = $(window).height();
        var this_height;
        if(cssobj&&cssobj["height"])
          this_height=cssobj["height"];
        else
          this_height="620";
        var this_top=(wHeight-this_height)/2+_scrollHeight+"px";
        var this_top=(wHeight-this_height)/2+"px";

        var mycss=cssobj||{"width":"800px","height":"620px","top":this_top};
        var myifmcss=cssifm||{};//iframe样式
        $('#NoPermissionModal .modal-dialog').css(mycss).find('.modal-content').css({height: '100%',width: '100%'}).find('h4').html(otitle||"").end().find('.modal-body').css({height: '85%'}).find("#NoPermissioniframe").css(myifmcss);;

  }

//关闭方法
function close()
{
$('#NoPermissionModal').modal('hide');
}

0 0
原创粉丝点击