CODEWITHSUNDEEP
jquery
hstur
hstur

Reputation: 39

Open fancybox iframe with delay

I am trying to use fancybox for showing iframe, but I want animation on link, so I need to delay fancybox popup. I've tried some solutions from here, but nothing worked for me. Here is my code, thank you for help!

JS:

    <script type="text/javascript">
$('.stesti').click(function () {
       setTimeout(function(){      
           $('.stesti').addClass('fancybox');
          $(".stesti").trigger('click');
       }, 3000);
});
     </script>

HTML:

<div id="button"><a class="stesti fancybox.iframe button" href="iframe.html"></a></div>

Upvotes: 0

Views: 1231

Answers (1)

wk_
wk_

Reputation: 301

You will have to open Fancybox manually:

$(document).ready(function() {
  $('.stesti').click(function(e)
  {
    e.preventDefault(); // prevents browser following the link
    var href = $(this).attr('href'); // save the url

    setTimeout(function(){
      // Open Fancybox manually:
      $.fancybox.open([{
        type : 'iframe',
        href: href
      }]);
    }, 3000);
  });
});
<!-- Include jquery and fancybox files -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://fancyapps.com/fancybox/source/jquery.fancybox.css" rel="stylesheet"/>
<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>

<!-- Your link: -->
<a class="stesti button" href="/iframe.html">Link</a>

Upvotes: 1

Related Questions