随着Web上信息量越来越大,如何有效展示信息成了重要难题。经过实践检验,使用内联框架(iframe)是一种很好的解决方案,特别是在后台管理系统的设计上。使用内联框架,能更清晰的展示信息层级和缩短页面响应时间。下面是实现内联框架的一个原型,其中有使用到Smarty类库进行分层,关于Smarty的配置不是这里的重点,不在赘述。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Framework Prototype</title> <style type="text/css"> body{ text-align:center;} #head, #container, #footer{ margin: 10px auto; width: 1024px; text-align: left;} #head{ background: #6495ED;} h3, h4{ text-align: center; padding: 10px;} #menu{ float: left; width: 124px; height: 300px; background: #FDF5E6;} #frameDiv{ float: left; width: 880px; margin: 0 0 0 15px; border: 1px solid #CCC;} #clearFloat{ clear: both; margin: 0; padding: 0; width: 0; height: 0; border: 0;} </style> </head> <body> <div id="head"> <h3>This is a Framework Prototype</h3> </div> <div id="container"> <div id="menu"> <ul> <!-- Ver 1 <li><a href="./demo/templates/php.html" target="rightframe">PHP</a></li> <li><a href="./demo/templates/python.html" target="rightframe">Python</a></li> <li><a href="./demo/templates/perl.html" target="rightframe">Perl</a></li> --> <!-- Ver 2 (Using Smarty) --> <li><a href="./demo/process.php?lang=php" target="rightframe">PHP</a></li> <li><a href="./demo/process.php?lang=python" target="rightframe">Python</a></li> <li><a href="./demo/process.php?lang=perl" target="rightframe">Perl</a></li> </ul> </div> <div id="frameDiv"> <iframe src="./demo/process.php" name="rightframe" width="100%" height="300px" frameborder="0"></iframe> </div> </div> <div id="clearFloat"></div> <div id="footer"> <h4>Powered by: <u>phplaber</u></h4> </div> </body> </html>
2.控制器
<?php require '../Smarty/Smarty.class.php'; $smarty = new Smarty; $language = $_GET['lang']; if ($language == '') $smarty->display('default.html'); else { $smarty->assign("lang", $language); $smarty->display('info.html'); }
3.视图
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>{$lang} page</title> <style type="text/css"> </style> </head> <body> <h1>Hello {$lang}</h1> </body> </html>