Fancybox issues: repostioning fancybox, close on hover out

206 views Asked by At

I'm trying to position the fancybox near it's trigger element with beforeShow: function(). It's not working.

I'm also trying to close fancybox on hover out. Using $.fancybox.close(); It's opening on hover over but not closing on hover out. I'm trying to get hover out to work on both the trigger element and the fancybox.

Here's the html:

<a class="fancybox-effects-e" width="300" height="250" href="page.html" title="<b>Title: </b>Lorem ipsum dolor sit amet, consectetur adipiscing elit"><img src="assets/imgs/web/2.jpg" alt="" /></a>

Here's my JS:

$("a.fancybox-effects-e").fancybox({
            beforeShow: function(){                         
                var position = this.element.offset();
                $("a.fancybox-effects-e")._getPosition = function() {
                    return position;
                }
            console.log("position = " + position);  
            this.width = $(this.element).data("width");
            this.height = $(this.element).data("height");
            },
            frameWidth  : '100%',
            frameHeight : '100%',
            fitToView: false,
            autosize: false,
            overlayShow : false,
        /*  wrapCSS    : 'fancybox-custom', */
            closeClick : true,
            openEffect : 'elastic',
            openSpeed  : 150,
            closeEffect : 'elastic',
            autoCenter: false,
            closeSpeed  : 10,

            type:'iframe',
            helpers : {

                title : {
                    type : 'inside'
                }
            }}
            )
            .hover(function () {
            $(this).click();
        }, function(){
            $.fancybox.close();
        });
0

There are 0 answers