CODEWITHSUNDEEP
jquerysettimeoutfancybox-2
user2649512
user2649512

Reputation: 13

Fancybox, setTimeout not working in a page after redirection

First at all, sorry for my question, I am new to jQuery and Javascript in general. I found in this page a nice code that works very well in my offline tests, and also works in the online site, but not for the specific page I want it to be loaded. This is the code:

<script type="text/javascript">
setTimeout(function() {

$.fancybox({
    'width'             : 292,
    'height'            : 62,
    'autoScale'         : true,
    'transitionIn'      : 'fade',
    'transitionOut'     : 'elastic',
    'openEffect'        : 'fade',
    'closeEffect'       : 'elastic',
    'type'              : 'iframe',
    'href'              : "http://www.facebook.com/plugins/likebox..."
});
}, 5000);   
</script>

I put this code in the Head section, after loading all the required JS and CSS files. As said, it works fine everywhere except where I would like to have it. The reason for that is probably because that page is the result of a redirection. I mean: page A redirects to Page B, and I put the code in Page B. If the code were in Page A, it would have worked fine, but unfortunatelly I need it in Page B.

The reason I am using setTimeout is because it is the easiest code I found anywhere to load the popup fancybox once the page has finished loading; one does not need to add a reference to the iframe in the body section, and it is really easy to define the size of the box.

Could please somebody help me with it?

Many thanks in advance.

Upvotes: 1

Views: 628

Answers (1)

Sushanth --
Sushanth --

Reputation: 55750

Remove the setTimeout and try encasing your code in Document Ready handler

<html>
   <head>
      // Your css files come here
   </head>
   <body>
       // You main HTML
      <script dependencies> go here  .. 
      <script  jquery
      <script fancybox plugin
      <script type="text/javascript">
        $(function() {
            $.fancybox({
                'width'             : 292,
                'height'            : 62,
                'autoScale'         : true,
                'transitionIn'      : 'fade',
                'transitionOut'     : 'elastic',
                'openEffect'        : 'fade',
                'closeEffect'       : 'elastic',
                'type'              : 'iframe',
                'href'              : "http://www.facebook.com/plugins/likebox..."
            });
        });
    </script>
 </body>
</html>

Upvotes: 1

Related Questions