我寫的jQuery程式碼

<!--   引入jQuery -->
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

        $(function() {
            var subshowtime = "";   //變數，“2秒後自動隱藏”的物件賦值給這個變數
            var urlparamsub = "";      //接收從上一連結的頁面傳遞過來的引數1 子選單(span)
            var urlparammain = ""     //接收從上一連結的頁面傳遞過來的引數2 主選單(圖片)id
            var $imghoverobj = "";       //記錄滑鼠懸停的圖片物件
            var $subspanhoverobj = "";   //記錄滑鼠懸停在某個子選單（span）的物件
            var $subspanchkedobj = ""; //記錄點選的子選單的span物件
            // 頁面跳轉後接收傳遞的引數，並初始化一些引數：選中的子選單和主選單
            //根據url傳來的引數，對主選單和子選單的處理
            // 功能：1，將點選的主選單樣式變成點選後的樣式。2，點選的主選單對應的子選單(div)顯示。
            //       3，顯示的子選單裡的點選的子選單（span）的顯示
            function getUrlParameter() {
   
                var strHref = "";
                //接收當前URL的資訊,注意 這裡加 parent,獲得 整個框架的url
                strHref = parent.document.location.toString();  
                var intPos = strHref.indexOf("?");     //取得"?"的位置 
                var urlparam = strHref.substr(intPos + 1); //獲取到右邊的引數部分"f=..&page=..."
                intPos = urlparam.indexOf("&");
                urlparamsub = urlparam.substr(2, intPos - 2); //子選單(span)id :spanimgsolutions2
                urlparammain = urlparam.substr(intPos + 6); //主選單的名字，其中前面的img被省略了
                if (urlparamsub == "") { //頁面第一次開啟的時候，引數設定
                    urlparamsub = "spanimghome";   
                    urlparammain = "home";        
                }
                urlparammain = "img" + urlparammain + "id"; //主選單(圖片)的id
                $subspanchkedobj = $("#" + urlparamsub); //記錄點選的子選單的span物件
                imgClickStyle($("#" + urlparammain));     // 1
                imgMatchSubShow($("#" + urlparammain)); //2 和 3
    
            }
            getUrlParameter(); //頁面載入的時候直接執行
            
            //===================================================================================================================\
            //|| 滑鼠點選某個子選單(span)的事件,傳遞的引數：1，f:點選的子選單(span)的id . 2，主選單的名字，其中前面的img被省略了||
            //===================================================================================================================\
            $("#subMenu span").click(function() {
                SubSpanclickedStyle($(this)); //子選單（即span）點選後的樣式
                var f = "";      //子選單的名字
                var varpage = "";   //主選單的名字 
                var varhref = $(this).parent().attr("href");
                var varhrefspanid = $(this).attr("id"); //這裡是span的id e.g : spanimgsolutions2
                f = $(this).text(); //暫時沒用 span 裡的 text
                varpage = $(this).parent().parent().attr("id").substr(3); //solutions
                window.open(varhref + "?f=" + varhrefspanid + "&page=" + varpage, "_parent");
            })
            //滑鼠懸停在主某一選單上（一個圖片上）
            $("#imgDiv :not(.imgblank)").hover(function() {
                allHide(); //先將所有的子選單隱藏
                if (subshowtime != "")
                    clearTimeout(subshowtime); //停止2秒後自動隱藏
                if ($imghoverobj != "") {   //上次滑鼠懸停的選單，恢復原來的圖片
                    imgOriginalStyle($imghoverobj); //上次懸停的選單恢復原來的src
                }
                imgHoverStyle($(this)); //懸停時候圖片的新src屬性
                if ($("#" + urlparammain).attr("id") == $(this).attr("id")) {
                    imgClickStyle($(this));     //保持點選後的樣式
                }
                //this 對應的子選單顯示，及被選中的子選單的樣式的改變
                imgMatchSubShow($(this));
                $imghoverobj = $(this); //滑鼠懸停的圖片物件
            }, function() {   // 滑鼠移開後（與上面的是聯合事件）
                var varthisobj = $(this).attr("class"); //從主選單的屬性class 獲得子選單的id(認為設定主選單class屬性值==對應該子選單的id)
                var thisobj = document.getElementById(varthisobj); //獲得子選單的物件（子選單的div）
                var $hiddiv = $(thisobj); //DOM 物件 轉化成 Jquery 物件, $hiddiv 為 點選的主選單對應的子選單（div）物件
                subshowtime = setTimeout(function() { subDivHidAnChkedShow($hiddiv) }, 2000);   //2秒後自動隱藏及點選的選單顯示
            });

            $("#imgDiv :not(.imgblank)").click(function() {   //點選主選單事件
                //主選單點選後的樣式
                imgClickStyle($(this));
                //imgcontactid   --- spanimgcontact
                var varid = $(this).attr("id");
                var indexvar = varid.lastIndexOf("id");
                var temp = varid.slice(0, indexvar); //取出字串的中間部分 “contact”
                var subid = "span" + temp;       //取得子選單的id
                $("#" + subid).triggerHandler("click");
            })
            //-----------------------下面是對子選單的處理--------------◆------------------\
            $("#subMenu div").hover(function() {   //滑鼠懸停在子選單（div層）的事件
                if (subshowtime != "")
                    clearTimeout(subshowtime);
                $(this).show();
            }, function() {     //滑鼠離開子選單（div層）的事件
                var $hiddiv = $subspanhoverobj.parent().parent();
                subshowtime = setTimeout(function() { subDivHidAnChkedShow($hiddiv) }, 2000);   //2秒後自動隱藏及點選的選單顯示
            });
            $("#subMenu span").hover(function() {      //滑鼠懸停在某個子選單的事件
                if ($subspanchkedobj.attr(`id`) == $(this).attr(`id`)) { //如果this 是有點選過的子選單
                    SubSpanclickedStyle($(this));
                }
                else {
                    subSpanHoverStyle($(this)); //滑鼠懸停的span的樣式
                    $subspanhoverobj = $(this);   //記錄滑鼠懸停的span的物件
                }
            }, function() {       //滑鼠離開某個子選單的事件
                if ($subspanchkedobj.attr(`id`) == $(this).attr(`id`)) { //如果this 是有點選過的子選單
                    SubSpanclickedStyle($(this));
                } else {
                    subSpanOriginalStyle($(this)); //恢復span 最原始的樣式
                }
            });
            //=====================================================================\
            //|| 某一子選單（div）2秒後自動隱藏,被點中的主選單對應的子選單顯示   ||
            //======================================================================\
            function subDivHidAnChkedShow($subdiv) {
                $subdiv.hide();         //子選單隱藏
                if ($subspanchkedobj != "") //如果有子選單（span）被選中，則該子選單對應的父級的父級的選單（div）顯示
                    $subspanchkedobj.parent().parent().show();
            }
            //=========================================\
            //|| 某一主選單（即圖片）最原始的樣式 ||
            //=========================================\
            function imgOriginalStyle($imgObj) {
                var Num1 = $imgObj.attr("src").indexOf("_"); // “_”的位置，（js 下標從0開始）
                var NewStrUrl1 = $imgObj.attr("src").substring(0, Num1 + 1);    //擷取 “_”之前的字串
                var NewSrc1 = NewStrUrl1 + "up.gif";   //原來的圖片
                $imgObj.attr("src", NewSrc1);   // 選單恢復原來的src
            }
            //==========================================\
            //|| 某一主選單（即圖片）滑鼠懸停時的樣式 ||
            //==========================================\
            function imgHoverStyle($imgObj) {
                var Num = $imgObj.attr("src").indexOf("_"); // “_”的位置，（js 下標從0開始）
                var NewStrUrl = $imgObj.attr("src").substring(0, Num + 1);    //擷取 “_”之前的字串
                var NewSrc = NewStrUrl + "over.gif"; //記下this的src
                $imgObj.attr("src", NewSrc);     //懸停時候圖片的新src屬性
                $imgObj.css("cursor", "pointer"); //滑鼠變成手型    
            }
            //======================================\
            //|| 某一主選單（即圖片）點選後的樣式 ||
            //======================================\
            function imgClickStyle($imgObj) {
                var ckNum = $imgObj.attr("src").indexOf("_"); // “_”的位置，（js 下標從0開始）
                var ckNewStrUrl = $imgObj.attr("src").substring(0, ckNum + 1);    //擷取 “_”之前的字串
                var ckNewSrc = ckNewStrUrl + "there.gif";     //點選後的圖片src
                $imgObj.attr("src", ckNewSrc);    //點選圖片的新src屬性
                $imgObj.css("cursor", "auto"); //滑鼠變成手型
            }
            //========================================\
            //||點選主選單，對應的子選單（div）的顯示||
            //========================================\
            function imgMatchSubShow($imgobj) {
                var varthisobj = $imgobj.attr("class"); //從主選單的屬性class 獲得子選單的id(認為設定主選單class屬性值==對應該子選單的id)
                var thisobj = document.getElementById(varthisobj); //獲得子選單的物件（子選單的div）
                $thisobj = $(thisobj); //DOM 物件 轉化成 Jquery 物件
                $thisobj.show();     //子選單顯示
                //如果“子子選單（span）”對應的父級主選單是顯示的子選單(div)
                if ($subspanchkedobj.parent().parent().attr("id") == $thisobj.attr("id"))
                    SubSpanclickedStyle($subspanchkedobj);    //點選的子選單的span物件顯示
            }
            //========================================\
            //|| 某一子選單（即span）點選後的樣式   ||
            //========================================\
            function SubSpanclickedStyle($subspanobj) {
   
                if ($subspanobj.text().length != 0) {   //篩選，因為頁面上有2個主選單對應的子選單內容知識個空格
                    $subspanobj.css("background-color", "#112277");
                    $subspanobj.css("color", "#ffffff");
                }
            }
            //==========================================\
            //|| 某一子選單（即span）滑鼠懸停的樣式   ||
            //==========================================\
            function subSpanHoverStyle($subspanobj) {
                if ($subspanobj.text().length != 0) {   //篩選，因為頁面上有2個主選單對應的子選單內容知識個空格
                    $subspanobj.css("background-color", "#7788bb"); //背景顏色變換
                    $subspanobj.css("color", "#ffffff");    //字型顏色發生變化
                }
            }
            //==========================================\
            //|| 某一子選單（即span）最原始的樣式   ||
            //==========================================\
            function subSpanOriginalStyle($subSpanObj) {
                $subSpanObj.css("background-color", "#bbccee");
                $subSpanObj.css("color", "#666666");
            }
        }) // “$(function() { ” 的結果標籤
        function allHide() {   //全部的子選單隱藏，除了點選後的主選單對應的子選單
            $("#subMenu div").hide();
        }
    </script>