FancyBox，让Ajax在窗口加载点击/点击

我试图让一个fancybox窗口在点击ajax调用后出现。我能做到这一点罚款FancyBox，让Ajax在窗口加载点击/点击

$(document).ajaxStop(function() { 

    //FancyBox image zoom functionality jQuery script 
    $("a.aboutContentImage").fancybox({ 
     'zoomOpacity': true, 
     'zoomSpeedIn': 300, 
     'zoomSpeedOut': 300, 
     'overlayShow': true, 
     'frameWidth': 800, 
     'frameHeight': 600 
    }); 
});

我要指出，a.aboutContentImage没有出现在页面上，直到AJAX调用之后。

然后在窗口打开后，我需要从ajax调用中加载一些文本。我试过了

$("a.aboutContentImage").live("click", function(e) { 

    // ajax here 
});

但是在试图将一个事件侦听器放在fancybox对象上时存在某种兼容性问题。

来源

2011-09-26 Steve Robbins

你想加载花式框中的文本？也许这有助于：http://stackoverflow.com/questions/2128652/how-to-determine-when-fancybox-is-open –

首先，为什么不把文本添加到图像标题？ Fancybox自动将标题添加到标题中。如果您需要做其他事情，请尝试使用Fancybox onComplete回调（ref）？我没有测试过这一点，但它应该工作：

$(document).ajaxStop(function() { 
    //FancyBox image zoom functionality jQuery script 
    $("a.aboutContentImage").fancybox({ 
    'zoomOpacity': true, 
    'zoomSpeedIn': 300, 
    'zoomSpeedOut': 300, 
    'overlayShow': true, 
    'frameWidth': 800, 
    'frameHeight': 600, 
    'onComplete' : function(){ 
     // do whatever here 
     var txt = $('#text').text(); 
     $('#fancybox-title-float-main') 
     .append(txt) 
     .show(); 
    } 
    }); 
});

添加到#fancybox-title-float-main将在文本添加到的无论是在title属性结束。所以你可能想使用.html()而不是.append()或其他。

来源

2011-09-27 22:34:01 Mottie

嗯，好吧，如果你没有图像的标题属性，'#fancybox -title-float-main' div不存在，所以你可以将内容添加到'＃fancybox-title'中，但是你必须为它添加一些CSS样式。另一种解决方案是将内容添加到图像所在的'＃fancybox-content'内，但是您需要将图像高度更改为不是100％，并将文本的高度添加到内容中窗户 - 真的很痛苦。 – Mottie

这是一个[demo]（http://jsfiddle.net/Mottie/UagVd/9/）...但没有所有的ajaxy东西。 – Mottie

这是拉动形式，图像等，不适合的东西，也不应该在标题中。 –

FancyBox，让Ajax在窗口加载点击/点击

回答

相关问题