2013-04-23 2 views
2

나는 인터넷에서 Fancybox를 다운로드하고 그것에 대한 작업을하고 있습니다. 링크를 클릭하면 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> 

그것은 잘 일하고있어. 하지만 누군가가 홈페이지에 로그인하면 자동으로 팝업해야합니다. 아무도 해결책을 도울 수 있습니까

답변

6

Fancybox는 자동 실행 방법을 직접 지원하지 않습니다. 내가 작업 할 수 있었던 작업은 숨겨진 앵커 태그를 만들고 onclick 이벤트를 트리거하는 것입니다. jQuery 및 fancybox js 파일이 포함 된 후에 onclick 이벤트를 발생시키는 호출이 포함되어 있는지 확인하십시오. 내가 사용한 코드는 다음과 같습니다 :

이 샘플 스크립트는 HTML에 직접 포함되어 있지만 js 파일에도 포함될 수 있습니다.

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

테두리 색상 개인적으로

내가 fancybox의 CSS 파일에서 그것을 할, 당신은

#의 fancybox-내용을 찾아야한다

.fancybox-outer

귀하의 요구에 따라 배경색 또는 테두리 색을 변경하십시오.

희망은 당신을 위해 작동합니다.

+0

와 앵커 태그가이

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

을 시도 할 수 있습니다 나는 버전 2.1.4 으로 테스트 한 Rahul 감사합니다 :) –

+0

만약 당신이 어떤 생각을 가지고 국경 색상을 변경할 수 있습니까 ?? threadless.com. 이것을 확인하고 컬러 박스 홈페이지에서 구독 신청서를보십시오. –

+0

테두리 색에 대한 대답이 업데이트되었습니다. – Rahul

1

이 코드는 잘 동작합니다. 나 자신에게 그것을

<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를 테스트 한 : 또한 ID fancybox-manual-a

+0

감사 Aditya :) –

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

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