jquery - qTip doesn't show content when used in each loop -
i trying create tooltips contents of div element using qtip + jquery. if try define tooltip static content, seems working fine. when try use them inside loop , contents of div element , try display tooltip, nothing shows up. have following code inside document ready function. display property set none class 'tooltip'
$.each($(".tooltip"), function (i, val) { var thecontent = $(val).html(); $(val).qtip({ content: $(val).html, style: { width: 200, background: '#ebf1ff', color: 'black', textalign: 'center', border: { width: 1, radius: 4, color: '#aaccee' }, tip: 'bottomleft', name: 'dark' } }); }); my html tags looks below:
<div class="vbarcontainer"><div id="gantt_65_1" class="gantt" style="border-width:medium;border-color:black;background:orange;width:6%;margin-left:0%;">0</div><div class="tooltip">quantity:15453</div></div> can point me doing wrong?
thanks, javid
my solution: managed working using sibling property of div next tooltip div element
$('.gantt').each(function () { $(this).qtip({ content: $(this).siblings('div.tooltip').html(), style: { width: 200, background: '#ebf1ff', color: 'black', textalign: 'left', border: { width: 1, radius: 4, color: '#aaccee' }, tip: 'bottomleft', name: 'dark' }, position: { corner: { target: 'topmiddle', tooltip: 'bottomleft' } } }); });
Comments
Post a Comment