FancyBox out of IFRAME callback

Question

I call fancybox from IFRAME and showing it out of the IFRAME - it works. But I have a problem with callback functions. [ I'm using FanxyBox 2 ]

I'd like to modify opacity and hover behaviour of the Prev/Next buttons with callback function but it does nothing.

Iframe demo [click on the picture]: http://keramika.dtech.sk/Keramika/Svietidla_Lampy.html

I've achieved proper behaviour in this "non IFRAME" demo: http://keramika.dtech.sk/test.html

As I understand callback function runs from "parent" perspective, so calling $(".fancybox-prev") is correct (not out of scope).

Callback 'afterShow':

'afterShow': function(){
            $(".fancybox-prev").css({"opacity": 0.1, "left":"-20px"});
            $(".fancybox-prev").hover(function(){
                $(this).css({"opacity": 0.6}); },
                function(){ $(this).css({"opacity": 0.1});
            });

Here is a bigger code part:

$(document).ready(function() {
$('#launcher').click(function(e){
e.preventDefault();
   parent.jQuery.fancybox( [
    {href:'/Keramika/Media/lampy/800x600/luci_obr2.jpg', title: '01'},
    {href:'/Keramika/Media/lampy/800x600/luci_obr3.jpg', title: '02'},
    {href:'/Keramika/Media/lampy/800x600/luci_obr4.jpg', title: '03'}
    ],  
    {
  'afterShow': function(){
            $(".fancybox-prev").css({"opacity": 0.1, "left":"-20px"});
            $(".fancybox-prev").hover(function(){
                $(this).css({"opacity": 0.6}); },
                function(){ $(this).css({"opacity": 0.1});
            });
     ...

Janis Janis · Accepted Answer · 2012-08-27T10:24:23

1

votes

I recommend using CSS for styling - http://jsfiddle.net/rNM8Z/

FancyBox out of IFRAME callback

1 Answers