使用iframe实现点击导航无刷新更换页面

在实现点击导航无刷新更换页面方法有好几种,iframe方式算是比较老的方法,但是它有它的好处,在使用iframe的时候不用考虑样式的覆盖,只需要对切换的页面设置好样式就可以了,不说了直接看例子吧,这些大家都知道

<nav class="navbar navbar-default">
    <div class="navbar-header">
        <a href="#" class="navbar-brand">IframeDemoa>
    div>
    <ul class="nav navbar-nav">
        <li class="active"><a href="templates/home.html" target="mainiframe"> Homea>li>
        <li><a href="templates/blog.html" target="mainiframe">Bloga>li>
        <li><a href="templates/about.html" target="mainiframe">Abouta>li>
    ul>

nav>
<div>
    <iframe name="mainiframe" src="templates/home.html" id="mainiframe" scrolling="no" onload="resizeFrameHeight()" frameborder="0" width="100%">iframe>
div>
<script type="text/javascript">

    function resizeFrameHeight(){
        var ifm = document.getElementById("mainiframe");
        ifm.height = document.documentElement.clientHeight - 50;
    }

    window.οnresize=function(){
        resizeFrameHeight();
    }
script>

完整代码:http://download.csdn.net/download/guoqianqian5812/10015610

你可能感兴趣的:(Python,Web)