jQuery,在页面加载时运行Fancybox

时间:2014-01-18 22:41:59

标签: jquery fancybox

我让jQuery Isotope正常运行,因此它创建了一个很好的链接列表,当用户点击链接时,它会按预期在Fancybox中提取iframe。我想添加到这个,所以我可以在页面加载时运行Fancybox。我需要添加什么?

用户流程:

[user on another page] -> [user clicks link] -> [redirect to this page/code which runs Fancybox on pageload]

目前的同位素代码:

<div class="portfolioFilter">
          Filter by: 
                <a href="#" data-filter="*" class="button3">Show All</a>
                <a href="#" data-filter=".A" class="button3">A</a>
                <a href="#" data-filter=".B" class="button3">B</a>
                ...
</div>
<div class="portfolioContainer">
     <div class="A isospacing">
          <a href="page.html" class="various" data-fancybox-type="iframe" id="S54"><span class="description">John Doe</span></a>  
          <a href="page2.html" class="various" data-fancybox-type="iframe" id="S55"><span class="description">Jane Doe</span></a>
          ...
      </div>
</div>

Jquery代码:

$(window).load(function(){
        var $container = $('.portfolioContainer');
        $container.isotope({
            filter: '*',
            animationOptions: {
                duration: 750,
                easing: 'linear',
                queue: false
            }
        }).trigger("click");

        $('.portfolioFilter a').click(function(){
            $('.portfolioFilter .current').removeClass('current');
            $(this).addClass('current');

            var selector = $(this).attr('data-filter');
            $container.isotope({
                filter: selector,
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
             });
             return false;
        }); 
    });

1 个答案:

答案 0 :(得分:0)

FYI,

我用这个解决了它:

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

});