Fancybox Automatic popup

Question

Я загрузил Fancybox из сети и работаю над ним.

<script type="text/javascript"> 
    $(document).ready(function() { 
     /* 
     * Simple image gallery. Uses default settings 
     */ 

     $('.fancybox').fancybox(); 

     $("#fancybox-manual-b").click(function() { 
      $.fancybox.open({ 
       href : 'contact.php', 
       type : 'iframe', 
       padding : 5 
      }); 
     }); 

    }); 
</script> 
<style type="text/css"> 
    .fancybox-custom .fancybox-skin { 
     box-shadow: 0 0 50px #222; 
    } 
</style> 

<a class="fancybox fancybox.iframe" href="contact.php">Subscribe</a> 

Это хорошо работает, когда вы щелкаете по ссылке. Но теперь мне нужно, чтобы он автоматически всплывал, когда кто-то заходил на домашнюю страницу. Может ли кто-нибудь помочь с решением

Answer 1

Fancybox напрямую не поддерживает способ автоматического запуска. Работа, над которой я мог работать, - создать скрытый тег привязки и запустить его событие onclick. Убедитесь, что ваш вызов для запуска события onclick включен после включения jquery и fancybox js-файлов. Код, который я использовал, следующий:

Этот образец скрипта встроен непосредственно в html, но он также может быть включен в файл js.

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

Цвет рамки

Лично я делаю это из файла CSS FancyBox, вы должны искать

# FancyBox-контента

и

.fancybox-external

и измените его цвет фона или границы цвета согласно вашему требованию.

Надеюсь, это сработает для вас.

Answer 2

Этот код работает хорошо. Я испытал это сам

<script type="text/javascript"> 
    $(document).ready(function() { 
$.fancybox({ 
         'width': '40%', 
         'height': '40%', 
         'autoScale': true, 
         'transitionIn': 'fade', 
         'transitionOut': 'fade', 
         'type': 'iframe', 
         'href': 'http://www.example.com' 
        }); 
}); 

NB: Я проверил его с версии 2.1.4 Вы также можете попробовать этот

$(document).ready(function() { 
      $("#fancybox-manual-a").trigger('click'); 
      }); 

есть якорь тег с идентификатором fancybox-manual-a

Answer 3

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

     $.fancybox.open('#id'); 
    }); 
</script>