Using FancyBox as an Error or Success Message without clicking on a link.

[Arc]

Hello guys, I would like to use fancybox as an Error and Success Message indication withouth clicking on a link.



Scenario:
A user fills out an HTML form and if some things are wrong, they see a fancybox image that is an Error. If they filled out the HTML form correctly, they see a fancybox image that is a Success message.

I am hiding the link for the fancybox, which you can see in the <a> tag, then using javascript to click on it automaticaly.

I am close to getting this working, but there is a bug where the image does not show up as a fancybox, it is just the image on a blank white page.


Here is my Code. These includes are in the correct directories.

 <!-- Add fancyBox --> 
<link rel="stylesheet" href="js/fancybox/source/jquery.fancybox.css?v=2.1.4" type="text/css" media="screen" /> 
<script type="text/javascript" src="js/fancybox/source/jquery.fancybox.pack.js?v=2.1.4"></script> 

 <script type="text/javascript"> 
 $(document).ready(function() { 
  $(".fancybox").fancybox(); 
 }); 
</script> 

Here is the code I am using to display the ERROR message.

 <!-- FancyBox Error Page --> 
<a id="errorLink" class="fancybox" hidden="true" href="images/panel/adv-trigger.png"><img src="images/panel/adv-trigger.png" alt="" /></a> 

 <script type="text/javascript"> 
document.getElementById("errorLink").click(); 
</script> 

Can someone please show me what I am doing wrong here? Thank you!