인터넷정보

레이어로 툴팁 효과내기

알 수 없는 사용자 2007. 10. 10. 14:05

<A id=test1 onmouseover="js_layer_tooltip_show(event,'실험용실험용실험용실험용실험용실험용실험용실험용실험용실험용실험용\n험용실험용\n험용실험용\n험용실험용\n험용실험용\n험용실험용\n험용실험용\n',400)" title="실헙입니다1. 실험이죠">tvzxcest</A>
<A id=test1 onmouseover="js_layer_tooltip_show(event,'실험용2',200)" title="실헙입니다1. 실험이죠">tvzxcest</A>


/*========================================
 js_lauer_tooltip.js
 레이어 툴팁

 ex>
 js_layer_tooltip_show([이벤트:event],[내용],[너비],[높이]) //높이는 안 사용하길 추천.
 <a id="test1" onmouseover="js_layer_tooltip_show(event,'내용',200[,200])" >test</a>

 mins01,mins,공대여자
 MSN,NateOn : mins01(at)lycos.co.kr
 2007-03-08
 "공대여자는 예쁘다."를 나타내야만 쓸 수 있습니다.
//========================================*/
var js_layer_tooltip_show_timeout_idx=null;
var js_layer_tooltip_root=null;
var js_layer_tooltip_show = function(evt,msg,width,height){
 if(!js_layer_tooltip_root) {
  js_layer_tooltip_root = js_layer_tooltip(msg,width,height);
  document.body.appendChild(js_layer_tooltip_root);
 }
 if(js_layer_tooltip_root.innerHTML!=msg){
  js_layer_tooltip_root.innerHTML = msg.replace(/\n/g,'<br />');
 }
  js_layer_tooltip_root.style.display='block';
  width?width:200;
  if(width)js_layer_tooltip_root.style.width=width+'px';
  if(height)js_layer_tooltip_root.style.height=height+'px';
  js_layer_tooltip_move(evt);
 
 this_s = evt.toElement?evt.toElement:evt.currentTarget;
 if(!this_s.onmouseout){
  this_s.onmouseout=function(){js_layer_tooltip_hide()}
 }
 if(!this_s.onmousemove){
  this_s.onmousemove=js_layer_tooltip_move;
 }
}
var js_layer_tooltip_hide = function(){
 js_layer_tooltip_root.style.display='none';
}
var js_layer_tooltip_move = function(evt){
 evt=evt||event;
 try{
 js_layer_tooltip_root.style.left=evt.clientX+10+'px';
 js_layer_tooltip_root.style.top=evt.clientY+10+'px';
 }catch(e){}
}
var js_layer_tooltip = function(){
 //========================================== 초기 설정
 var id = 'layer_tooltip';
 //========================================== 중복을 확인
 if(document.getElementById(id)){
  document.getElementById(id).a.focus();
  return false;}
 //========================================== 레이어를 만든다.
 var div_ori = document.createElement('div');
 var root = document.createElement('div');
 root.style.cssText='text-align:left;padding:5px;position:absolute;left:10px;top:10px;font-size:12px;line-height:100%;border:1px solid #A6CBFC;';
 root.style.backgroundColor='#DAE9FC';
 return root;
}

반응형