posts - 165, comments - 198, trackbacks - 0, articles - 1
            BlogJava :: 首頁 :: 新隨筆 :: 聯系 :: 聚合  :: 管理

          開發 javascript div 擴展使用

          Posted on 2008-04-23 17:41 G_G 閱讀(1631) 評論(1)  編輯  收藏 所屬分類: javascript
          此代碼可以直接使用


          <body>
          ?
          <a?id='pi'?href=""?value="text">?text?</a>
          ?
          <div?id='div1'/>
          </body>
          <script?type="text/javascript">?

          function?showByEvent(ev,divId){
          ????????
          //取得各瀏覽器?event?
          ????????ev?=?ev?||?window.event;
          ????????
          //div
          ????????var?useDiv??=?document.getElementById(divId);
          ????????useDiv.style.position
          ="absolute";
          ????????????
          if(?useDiv.style.left==""?)useDiv.style.left?=?"50";
          ????????????
          if(?useDiv.style.top==""?)useDiv.style.top?=?"10";
          ????????????
          if(?useDiv.style.zIndex==""?)useDiv.style.zIndex?=?"1000";
          ????????????
          if(?useDiv.style.padding==""?)useDiv.style.padding?=?"0px";
          ????????????
          if(?useDiv.style.backgroundColor==""?)useDiv.style.backgroundColor?=?"#FFFFCC";
          ????????????
          if(?useDiv.style.color==""?)useDiv.style.color?=?"#201000";
          ????????????
          if(?useDiv.style.fontSize==""?)useDiv.style.fontSize?=?"12px";
          ????????????
          if(?useDiv.style.border==""?)useDiv.style.border?="1px???solid???#284860";
          ????????
          ????????
          //得到處發事件的源element
          ??????var?actionBean?=??null?;
          ????????
          if(??ev.srcElement?){
          ????????????actionBean?
          =?ev.srcElement?
          ????????}
          else{
          ????????????actionBean?
          =?ev.target;
          ????????}
          ????????
          ????????
          //處發事件?
          ????????useDiv.onmousemove?=?function(){
          ????????????????useDiv.style.visibility??
          =?"";
          ????????}
          ????????useDiv.onmouseout?
          =?function(){
          ????????????????useDiv.style.visibility??
          =?"hidden";
          ????????????
          ????????}
          ????????actionBean.onmouseout?
          =??function?mouseOut(ev){
          ????????????????useDiv.style.visibility??
          =?"hidden";
          ????????}
          ????????
          ????????
          //div?定位
          ????????useDiv.style.left?=?actionBean.offsetTop+15?;
          ????useDiv.style.top?
          =?actionBean.offsetLeft+15;
          ????
          ????????
          //返回類型為?div?顯示的?x?,?y?和?target?處發源項?和?div
          ????????return?{
          ????????????y:??actionBean.offsetTop
          +15??,
          ????????????x:??actionBean.offsetLeft
          +15?,
          ????????????target:actionBean,
          ????????????div:useDiv
          ????????}
          }



          //事件添加
          document.getElementById('pi').onmousemove?=?function(ev){
          ??????
          var?sbv?=?showByEvent(ev,"div1");
          ??????
          var?bean?=?sbv.target?;
          ????
          var?dd?=?sbv.div;
          ????dd.style.visibility??
          =?"";
          ????dd.innerHTML?
          =?"<a?href=http://www.baidu.com>刪除"+bean.value+"</a><br>"+
          ????????????????????????????????????
          "<a?href=http://www.google.com>詳細?by?Id?"+bean.id+"</a>";

          };

          </script>




          評論

          # re: 開發 javascript div 擴展使用  回復  更多評論   

          2008-04-25 15:13 by 懶人
          好像是為了給層定位,處理它最基本的事件吧?
          主站蜘蛛池模板: 湟中县| 万年县| 准格尔旗| 永济市| 绿春县| 同德县| 阳原县| 大同市| 南京市| 福州市| 绥中县| 武平县| 康平县| 宣化县| 长寿区| 龙游县| 南乐县| 乐东| 无锡市| 绵阳市| 清徐县| 宁德市| 竹北市| 襄垣县| 新蔡县| 沙雅县| 焦作市| 仁化县| 嘉义县| 兴和县| 凤凰县| 大渡口区| 湘乡市| 大姚县| 琼海市| 韩城市| 麟游县| 清涧县| 焦作市| 崇礼县| 庆阳市|