jQuery के यूआई टूलटिप माता पिता div

Question

से बाहर ले जाता है नीचे दिए गए लिंक में दिए गए के रूप में मैं एक jQuery टूलटिप है:

http://jsfiddle.net/ronnykroy/amYZW/2/

HTML:

<div id="parent"> 
    <div id="child" title="It has been a very long text"> 
    </div> 
</div> 

सीएसएस:

#parent{ 
    position:absolute; 
    width: 500px; 
    height: 200px; 
    background-color:#00f; 
} 

#child{ 
    position:absolute; 
    left:400px; 
    width: 100px; 
    height:150px; 
    background-color: #f00; 
} 
.tooltipclass{ 
    width: 50px; 
    background-color: #ffffff; 
    color: #000000; 
} 

निम्नानुसार Jquery के साथ:

$("#child").tooltip({ 
    track: true, 
    tooltipClass: "tooltipclass" 
}); 

अब जब मैं 'बच्चे' पर होवर करता हूं, तो मैं टूलटिप को बाहरी माता-पिता को स्थानांतरित नहीं करना चाहता हूं। टूलटिप गतिशील रूप से 'पैरेंट' के भीतर ही सीमित होना चाहिए।

Answer 1

jQueryUI टूलटिप के एपीआई में position विकल्प का उपयोग करें। position विकल्प jQuery UI Position का उपयोग करता है, इसलिए सुनिश्चित करें कि उसमें देखें।

$("#child").tooltip({ 
    track: true, 
    tooltipClass: "tooltipclass", 
    position: { within:"#parent"} 
}); 

डेमो: http://jsfiddle.net/dirtyd77/6EZHZ/

आशा इस मदद करता है और मुझे पता है कि आप किसी भी अन्य प्रश्न हैं करते हैं।

Answer 2

कोशिश इस

jsfiddle

$("#child").tooltip({ 
    track: true, 
    tooltipClass: "tooltipclass", 
    position: { my: "left top+15", at: "left bottom", collision: "flipfit" } 
});