iframe学习笔记

今天学习了一下iframe，现在对其应用做下小结。新手，不喜勿喷~

用iframe是为了通过导航栏，来实现子页面的跳转。

首先，现用jquery ui layout将页面分成了两部分，

如图，

然后用

Amaze UI

添加了标题栏和导航栏，如图

然后在layout-center中，通过js导航iframe代码

<div class="ui-layout-center ">
    <div class="iPage">
        <iframe class="ui-layout-center" id="src-page" frameborder="0" scrolling="auto"></iframe>

    </div>
</div>

$(document).ready(function () {
   $('body').layout({ applyDemoStyles: true });
   $('#src-home').click(function(){
       $('#src-page').attr("src","home.html");
    })
});

最终实现了iframe页面的加入，如图

为了自己的学习，写篇博客记录下~