fanybox与iframe工作在Chrome，但不工作在IE或FireFox

FancyBox with iframe working in Chrome but not working in IE or FireFox

本文关键字：工作 IE FireFox Chrome iframe fanybox      更新时间：2023-09-26

Fancybox模态窗口在Chrome中工作，但在IE或FireFox中不起作用。要查看此内容，请访问https://billiving-qa.azurewebsites.net/spa1/#/invoice点击"模板样式"窗口。

Html: 

<a fancybox="" href="#/templates?mp=b" class="btn fb-templates fancybox.iframe"><i class="fa fa-font"></i> Template Styles</a>
指令

myApp.directive('fancybox', ['$compile', '$timeout', function ($compile, $timeout) {
    return {
        link: function ($scope, element, attrs) {
            element.fancybox({
                hideOnOverlayClick: false,
                hideOnContentClick: false,
                enableEscapeButton: false,
                showNavArrows: false,
                scrolling: false,
                iframe: {'scrolling': 'no'},
                onComplete: function () {
                    $timeout(function () {
                        $compile($("#fancybox-content"))($scope);
                        $scope.$apply();
                        $.fancybox.resize();
                    });
                }
            });
        }
    }
}]);

显然，这只发生在单页应用程序中。我最后的解决方法是添加另一个html页面，并在调用pop窗口时引用它:

<a fancybox="" href="popup.html#/templates?mp=b" class="btn fb-templates fancybox.iframe"><i class="fa fa-font"></i> Template Styles</a>
相关文章：