這篇，介紹一個Frameset做的簡單到不能再簡單的框架。
好先來看看這個框架的頁面構成，由於是純手工做的測試程序，所以只是在Notepa 中做了一下代碼，很粗略。但還是包含了Frameset中的大致內容的。好，言歸正傳，首先看一下文件構成。
1.Frame.html包含框架的結構
2.link.html包含框架左側選單列
3.firstPage.html包含框架主頁的一行文字（個人比較懶，沒有好好做）
4.secondPage.html和上方3類似，用於測試。
下面是一個截圖（不清楚，第一次搞這東西）
先看一下Frame.htm中的程式碼：
html>
是感覺很簡單？主要是一個Frameset元素，然後設定了cols="159px,*"這個屬性。這個屬性的作用就是將頁面分割成159px和其他兩塊區域。如上圖所示。
接著是frame標記，上面的cols屬性有幾個值下面的子元素對應的也應該有幾個。然後是一些常見的屬性。包括邊框的寬度，是否出現捲軸，邊框顏色，是否允許使用者改變大小。來源檔案是哪個等等一些屬性。
然後將第二個的原始檔案指向firstPage作為測試用。
接下來是link.html:
var LastLeftID = "";
function menuFix() {
var obj = document.getElementById("nav").getElementsByTagName("li");
for ( var i=0; i
obj[i].onmouseover=function() {
this.className =(this.className.length>0? " ": "") "sfhover";
}
obj[ ] .onMouseDown=function() {
this.className =(this.className.length>0? " ": "") "sfhover";
}
obj[i].onMouseUp > }
obj[i]。 ) {
this.className =(this.className.length>0? " ": "") "sfhover";
}
obj [i].onmouseout=function() {
obj [i].onmouseout=function() {
. className=this.className.replace(new RegExp("( ?|^)sfhover\b"), "");
}
}
}
function DoMenu(emid)
{
var obj = document.getElementById(emid);
obj.className = (obj.className.toLowerCase() == "展開"?"collapsed":"展開");
if((LastLeftID!="")&&(emid!=LastLeftID)) //關掉上一個選單
{
document.getElementById(LastLeftID).className = "collapsed";
}
LastLeftID = emid;
}
LastLeftID = emid;{
var MenuID="";
var _paramStr = new String(window.location.href);
var _sharpPos = _paramStr.indexOf("#");
_sharpPos >= 0 && _sharpPos {
_paramStr = _paramStr.substring(_sharpPos 1, _paramStr.length); }
if (_paramStr.length > 0)
{
var _paramArr = _paramStr.split("&"); {
var _paramKeyVal = _paramArr[0].split("=");
if (_paramKeyVal.length>0)
if (_paramKeyVal.length>0)
🎜> }
}
}
if(MenuID!="")
{
DoMenu(MenuID)
{
DoMenu(MenuID)
攝取選單🎜 (); //*這兩個函數的順序要注意一下，否則在Firefox裡GetMenuID()達不到效果
menuFix();
-->
這個其實就偷懶了，是從網路上找的一個DIV CSS JS做的一個下拉式選單，有興趣的可以自己看一下，我覺得自己能用起來，知道怎麼改就OK了。
下面是兩個測試頁面，由於這連個測試頁面有點懂點HTML的互相寫出來，這裡就只貼出頁面1的程式碼：
第一頁 樣式>
第一頁
估計高手看到這都要吐了，一定說很垃圾，不過只是記錄下自己做的小東西。
