`
lirenjiede
  • 浏览: 13320 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

html option tip message through by div

 
阅读更多

used js code like below

 

 

function dropdown_over(obj,msg,evt){
            createTips(obj,msg,evt);
        }
        function dropdown_out(obj){
            removeTips(obj);
        }
       
        function createTips(obj,msg,evt){
            var p = GetMouse(evt);
            var $tips = document.createElement("span");
            $tips.id = "tips_" + obj.id;
            $tips.innerHTML = msg;
            $tips.style.position = "absolute";
            $tips.style.left = p.x+"px";
            $tips.style.top = (p.y+16)+"px";
            $tips.style.zIndex = 1001;
            $tips.style.border = "1px solid #666";
            $tips.style.backgroundColor = "#FE0";
            $tips.style.color = "#000";
            $tips.style.fontSize = "10pt";
            $tips.style.padding = "3px;";           
            document.body.appendChild($tips);
        }
       
        function removeTips(obj){
            var $tips = document.getElementById("tips_" + obj.id);
            if($tips != null)
                document.body.removeChild($tips);           
        }
       
        function GetMouse(evt){
         evt = evt||window.event;
         return  pointer = {
          x:evt.pageX || (evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)),
          y:evt.pageY || (evt.clientY + (document.documentElement.scrollTop  || document.body.scrollTop ))
         };
        }

 

html code is like this:

 

<select id="dropdown" onmouseover="dropdown_over(this,'Tip Msg',event)" onmouseout="dropdown_out(this)">
            <option >001</option>
            <option >002</option>
            <option >003</option>
            <option >004</option>
            <option >005</option>
        </select>

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics