Use the Bootstrap framework to pop up the iframe page and load the iframe page in the pop-up modal box_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:57:19
Original
3138 people have browsed it

HTML code:

<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">×</button>--%>                <button type="button" class="close" onclick="window.history.go(-1);">×</button>                <h4 class="modal-title" id="NoPermissionModalLabel">系统消息</h4>            </div>            <div class="modal-body">                <iframe id="NoPermissioniframe" width="100%" height="50%" frameborder="0"></iframe>            </div>            <div class="modal-footer"><%--                <button type="button" class="btn btn-default " data-dismiss="modal">    关  闭    </button>--%>                <button class="btn btn-default"  type="button" onclick="window.history.go(-1);" >    关  闭    </button>            </div>        </div>    </div></div>  <input type="button" value="弹出模态框iframe" class="btn btn-primary" id="btnclick" ><img src="http://img.blog.csdn.net/20140923180316546?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2hpbmFwbGFu/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />
Copy after login

Js code:

$(function(){    $("#btnclick").click(function(){        var frameSrc = "../ErrorPages/NoPermission.html";        $("#NoPermissioniframe").attr("src", frameSrc);        $('#NoPermissionModal').modal({ show: true, backdrop: 'static' });    });});
Copy after login


Rendering:









Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template