Expandable ad script using jquery
I have an expandable ad script using jquery now in use. It uses three images - one with an "open" indicator, one with a "close" indicator, and a larger ad image. On loading it shows the ad for a designated time (now set to 2 seconds) and then closes it, allowing the reader the choice to then open the ad (or not).
It works, but I would like to add an option for it to not auto show the ad initially. If I set the code to zero seconds, it still briefly shows the ad, in a manner that is likely annoying to a site visitor. How can I change the script to not auto show the ad, but still have the open-close options?
Here is the script in use: http://towndock.net
Here is the script:
Code:
<script type="text/javascript">
jQuery().ready(function(){
jQuery('.ad_close a').click(function() {
jQuery('.ad_full').slideUp(function() {
jQuery('.ad_close').hide();
jQuery('.ad_view').show();
}).hide();
return false;
});
jQuery('.ad_view a').click(function() {
jQuery('.ad_close').show();
jQuery('.ad_view').hide();
jQuery('.ad_full').slideDown().show();
return false;
});
});
function close_ad() {
$('.ad_close a').click();
}
setTimeout("close_ad()",2000);
</script>
Here is the associated html:
Code:
<div id="ad_wrapper" style="text-align:center;">
<div class="ad_view">
<a href=""><img src="http://towndock.net/img/11722.gif" width="928" height="30" /></a>
</div>
<div class="ad_close">
<a href=""><img src="http://towndock.net/img/11721.gif" width="928" height="30" /></a>
</div>
<div class="ad_full">
<a href="http://www.orientalboatshow.com"_blank"><img src="http://towndock.net/img/11718.gif" width="928" height="200" alt="Come to the boat show" /></a>
</div>
</div>