js_layer_tooltip.js 레이어로 툴팁효과내기


tvzxcest tvzxcest


<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;
}

댓글
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
목록형 📷 갤러리형
제목
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
유용한 리눅스(LINUX) 명령어
[공지] 기술 게시판
4.28
4.29
4.30
5.1
5.2
5.3
5.4
5.5
5.6
5.7
5.8
5.9
5.11
5.12
5.13
5.14
5.15
5.16
5.17
5.18
5.19
5.20
5.21
5.22
5.23
5.24
5.25
5.26
5.27
5.28
5.29
5.30
5.31
6.1