Inline Call

I’m trying to implement an inline call in the Extended Call sections, but it seems not to be working properly.

Here is my JS:

jQuery("a#inline").fancybox({
	'overlayOpacity': "0.9",
	'overlayColor': "#000000",
	'titleShow': true,
	'titlePosition': 'float',
	'enableEscapeButton': true,
	'showCloseButton': true,
	'showNavArrows': true,
	'hideOnOverlayClick': true,
	'hideOnContentClick': false,
	'width': 560,
	'height': 340,
	'transitionIn': "fade",
	'transitionOut': "fade",
	'centerOnScroll': true,
	'type': 'inline'
});

Here is my a href link:
<a id="inline" href="#data"><img src="somefile.jpg" border="0"></a>

And My div:

<div id="data" style="width: 600px; height: 150px; display: none; position: absolute; z-index: 10;">
<h2>Alert</h2>
<p>TEST!! TEST !!!</p>

<p>Would you still like to continue?<br>
<a href="#">YES!</a> | <a href="#">No!</a></p>

</div>

However, when clicking on the link, the fancybox only creates a small 10 px x 10 px white box, with no content.

anyone can help?

https://www.ads-software.com/extend/plugins/fancybox-for-wordpress/