jQuery BubblePopup not displaying on modal dialog
I'm trying to put a bubblepopup inside a tab inside a modal dialog, all created with jquery ui.
The bubblepopup is this: http://www.vegabit.com/jquery_bubble_popup_v2/
I cant show much of the code, since its split among many templates, but here it goes (it all works, except the bubble):
--- modal:
<div id="report" title="Report">
</div>
<script>
$("#report").dialog({
autoOpen: false,
height: 440,
width: 350,
modal: true});
$("#report").load('/section/1/');
</script>
--- tab section
<div id="section-1">
<li><a href='/content_for_tab_1/'>Tab1</a></li>
</div>
<script>
$("#section-1").tabs();
</script开发者_如何学C>
--- here is the content for tab 1:
<p class="help_link"><a href="javascript:get_help('help_participation','participation')">Help</a></p>
<script>
$("#help_{{k}}").CreateBubblePopup({position : 'right',
align: 'center',
distance: '10',
width: '300',
innerHtmlStyle: {
color:'#000000',
'text-align':'center'},
tail: { align:'center', },
themeName: 'bubble',
themePath: 'media/image/'});
$("#help_{{k}}").SetBubblePopupInnerHtml('Lorem ipsum sit dolor amet');
</script>
Somehow, I cant make the bubblepopup to show inside the modal, only on other components of the page. Is this a bug in bubblepopup + modal dialog?
I realize this is an older post, but we just ran into the same issue and resolved it by setting the z-index of the Bubble Popup to something higher than the Dialog window:
$('.jquerybubblepopup').css('z-index','9999');
Use Firebug and track the HTML changes and you should see the popup being created, just behind the dialog.
精彩评论