These are what we need, in the tag:
<link href="shadowbox.css" rel="stylesheet" type="text/css"/> - to define our popup window
<script src="jquery.js" type="text/javascript"></script>
<SCRIPT type="text/javascript" src="shadowbox.js"></SCRIPT>
<script type="text/javascript"> Shadowbox.init({ language: 'en', players: ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv'] }); </script>
<script type="text/javascript" src="sizzle.js"></script>
<script type="text/javascript" src="shadowbox-en.js"></script>
<script type="text/javascript" src="shadowbox-img.js"></script>
<script type="text/javascript" src="shadowbox-html.js"></script>
<script type="text/javascript" src="shadowbox-iframe.js"></script>
<script type="text/javascript" src="shadowbox-qt.js"></script>
<script type="text/javascript" src="shadowbox-wmp.js"></script>
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="shadowbox-swf.js"></script>
<script type="text/javascript" src="shadowbox-flv.js"></script>
<script type="text/javascript" src="shadowbox-jquery.js"></script>
<script src="addthis_widget.js" type="text/javascript"></script>
- In the put this hidden div, will show up when the link is clicked:
<div style="visibility: visible;" id="sb-container">
<div style="background-color: rgb(0, 0, 0);" id="sb-overlay"></div>
<div style="top: 20px; width: 804px; left: 102px; padding-top: 0px; padding-bottom: 0px;" id="sb-wrapper">
<div style="height: 0px;" id="sb-title">
<div style="" id="sb-title-inner"></div>
</div>
<div style="height: 437px;" id="sb-body">
<div id="sb-body-inner"></div>
<div style="display: none;" id="sb-loading">
<a onclick="Shadowbox.close()">Cancel</a>
</div>
</div>
<div style="height: 20px;" id="sb-info">
<div style="" id="sb-info-inner">
<div id="sb-counter"></div>
<div id="sb-nav">
<a id="sb-nav-close" title="Close" onclick="Shadowbox.close()"></a>
<a style="display: none;" id="sb-nav-next" title="Next" onclick="Shadowbox.next()"></a> <a style="display: none;" id="sb-nav-play" title="Play" onclick="Shadowbox.play()"></a>
<a style="display: none;" id="sb-nav-pause" title="Pause" onclick="Shadowbox.pause()"></a>
<a style="display: none;" id="sb-nav-previous" title="Previous" onclick="Shadowbox.previous()"></a>
</div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</div>