2011-08-03 7 views
0

IE 8에서 도구 팁을 표시해야 할 때 내 도구 팁 코드에 "팁이 정의되지 않음"이 표시됩니다. 다음 코드는 다른 모든 브라우저에서 작동합니다.IE 8에서 도구 팁을 표시해야 할 때 내 도구 팁 코드에 "팁이 정의되지 않았습니다."가 표시됩니다.

는 // 이것은 전역 변수로 팁을 사용하는 것처럼

jQuery(".tiptrigger").hover(function(){ 
    tip = jQuery('#tool_content'); 
    tip.show(); //Show tooltip 
}, function() { 
    tip.hide(); //Hide tooltip 
}).mousemove(function(e) { 
    var mousex = e.pageX + 20; //Get X coodrinates 
    var mousey = e.pageY + 20; //Get Y coordinates 
    var tipWidth = tip.width(); //Find width of tooltip 
    var tipHeight = tip.height(); //Find height of tooltip 

    //Distance of element from the right edge of viewport 
    var tipVisX = jQuery(window).width() - (mousex + tipWidth); 
    //Distance of element from the bottom of viewport 
    var tipVisY = jQuery(window).height() - (mousey + tipHeight); 

    if (tipVisX < 20) { //If tooltip exceeds the X coordinate of viewport 
     mousex = e.pageX - tipWidth - 20; 
    } if (tipVisY < 20) { //If tooltip exceeds the Y coordinate of viewport 
     mousey = e.pageY - tipHeight - 20; 
    } 
    tip.css({ top: mousey, left: mousex }); 
}); 




    <p class="tiptrigger">Sample Tool tip 
     <div id="tool_content" class="tip" style="display: none;"> 
        Welcome 
     </div> 
    </p> 
+0

어떻게 다른 브라우저에 대해? – ShankarSangoli

+0

IE를 제외하고 모두 괜찮습니다 ... – AnNaMaLaI

답변

1

가 보이는 내 코드입니다. 이

var tip = null; 
jQuery(".tiptrigger").hover(function(){ 
    if(!tip) 
     tip = jQuery('#tool_content'); 
    tip = jQuery('#tool_content'); 
    tip.show(); //Show tooltip 
}, function() { 
    if(!tip) 
     tip = jQuery('#tool_content'); 
    tip.hide(); //Hide tooltip 
}).mousemove(function(e) { 
    if(!tip) 
     tip = jQuery('#tool_content'); 
    var mousex = e.pageX + 20; //Get X coodrinates 
    var mousey = e.pageY + 20; //Get Y coordinates 
    var tipWidth = tip.width(); //Find width of tooltip 
    var tipHeight = tip.height(); //Find height of tooltip 

    //Distance of element from the right edge of viewport 
    var tipVisX = jQuery(window).width() - (mousex + tipWidth); 
    //Distance of element from the bottom of viewport 
    var tipVisY = jQuery(window).height() - (mousey + tipHeight); 

    if (tipVisX < 20) { //If tooltip exceeds the X coordinate of viewport 
     mousex = e.pageX - tipWidth - 20; 
    } if (tipVisY < 20) { //If tooltip exceeds the Y coordinate of viewport 
     mousey = e.pageY - tipHeight - 20; 
    } 
    tip.css({ top: mousey, left: mousex }); 
}); 
0

당신의 모범으로가는하려고 시도 :

var tip = jQuery('#tool_content'); 

jQuery(".tiptrigger").hover(function(){ 
    tip.show(); //Show tooltip 
    //rest of your code 
관련 문제