dojo 將原橫式的dijit.Menu、PopupMenuItem改寫成直式飄浮選單

摘要:dojo 將原橫式的dijit.Menu、PopupMenuItem改寫成直式飄浮選單

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="/dojo/dijit/themes/tundra/tundra.css" />
<script language="JavaScript" type="text/javascript" src="/dojo/dojo/dojo.js" djConfig="parseOnLoad:true"></script>
<script language="JavaScript" type="text/javascript">
  //dojo.require("dijit.Menu");
dojo.require("dijit.Menu");
dojo.addOnLoad(
 function() {
  if (window.pub) {
            window.pub();
       }
       document.getElementById("MainMenu").style.display = "block";
 }
);  
               
</script>
</head>
<body class="tundra">

<div dojoType="dijit.Menu" id="MainMenu" style="display:none">
<已計算完值></div></div>
</div>
</body>
</html>

<已計算完值>(動態產生內容如下):

<div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_03.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://google.com.tw'" style="background-image:url('/images/m_03.jpg')">C.Y. </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://google.com.tw'" style="background-image:url('/images/m_03.jpg')">Milin </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://google.com.tw'" style="background-image:url('/images/m_03.jpg')">與您有約 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_04.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">HR關懷信箱 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">溝通與交流 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_05.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">賀卡專區 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">個人小秘書 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_06.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">社團介紹 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.google.com.tw'" style="background-image:url('/images/m_03.jpg')">表單與會議記錄 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">消費看版 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">特約商店 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">補助申請連結 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">跳蚤市場 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_07.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://vmxr7/MXIC/Announcement.nsf'" style="background-image:url('/images/m_03.jpg')">福委會公告 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">旺宏新聞 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">公告欄 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_08.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">子公司訊息分享 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">各中心訊息分享 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_09.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">工作與生活講座 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">文章分享 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">主管關懷日祝賀活動 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_10.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">文化講座 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">英雄榜  </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">傳承旺宏 </div> , </div></div><div dojoType="dijit.PopupMenuItem"><span><img src="/images/左邊選單/m_11.jpg" title="" style="width:189;height:37"></span><div dojoType="dijit.Menu" style="background-color:lightskyblue;width:160px"> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">心理諮詢 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">生活服務 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">法律諮詢 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">財務諮詢 </div> , <div dojoType="dijit.MenuItem" onclick="top.window.location='http://www.yahoo.com.tw'" style="background-image:url('/images/m_03.jpg')">醫療保健 </div>