0

我希望你们都能解决我在使用 JQuery Fancy Box 插件时遇到的一个小问题。

我的问题是我正在尝试使用绝对位置，这样无论叠加层大小如何，总有一些东西出现在叠加层的左上角。

http://www.csr500.co.uk/websites/v9/preview.html

现在我想要的是 jQ 和 FW 图标，目前位于左下角，位于左上角，与非覆盖模式类似。

我这样做的方式意味着标题标签中的文本不会在悬停时显示，这是我想要的，但是据我所知，这限制了我只能访问 fancybox-title-inside-wrap 类而不是花式盒子外层。

非常感谢您对解决此问题的任何帮助。

提前感谢大家

干杯

卡梅伦

4

1 回答 1

0

只是一个想法：为什么不将图标从该title部分中取出并用它们创建一个新的（隐藏的）div，例如

<div class="iconsPlaceHolder" style="display: none">
    <div class="overlay-technologies">
        <div class="overlay-technology-1">
            <div class="dev-icon"></div>
        </div>
        <div class="overlay-technology-2">
            <div class="web-icon"></div>
        </div>
    </div>
</div>

注意新的类iconsPlaceHolder，但可以是任何你想要的。

beforeShow然后只需使用回调将它们附加到您的fancybox

beforeShow: function () {
    $(".overlay-technologies").clone().appendTo(".fancybox-inner");          
}

请注意，我正在附加.overlay-technologies选择器，它是占位符 ( .iconsPlaceHolder) 的子代。另请注意，我clone之前必须使用选择器，appendTo因为它会从文档流中的位置移动并在fancybox 关闭时清除。当然，它需要适当的风格和位置。

检查JSFIDDLE

于 2013-05-19T00:13:03.490 回答