Fancybox和DNN DotNetNuke

时间:2012-11-21 19:41:01

标签: jquery fancybox

如何将Fancybox安装到DotNetNuke中? 我正在运行一个使用DNN 6.2并且需要将iframe内容放入灯箱的网站。 Fancybox似乎是最好的optioon,但如何安装呢?您是将文件上传到皮肤的文件夹还是上传到网站的根文件夹?

2 个答案:

答案 0 :(得分:0)

我在我的皮肤中加入了fancybox。 脚步: 1.确保js和css由您想要使用花式框的页面加载。 2.定义用于触发fancybox的锚点,在这种情况下,我还将fancybox的大小设置为动态,以便内容管理器可以更改它。

jQuery(document).ready(function () {

    jQuery('a.mylightbox').each(function () {
        var dWidth = parseInt($(this).attr('href').match(/width=[0-9]+/i)[0].replace('width=', ''));
        var dHeight = parseInt($(this).attr('href').match(/height=[0-9]+/i)[0].replace('height=', ''));
        $(this).fancybox({
        'width': dWidth,
        'height': dHeight,
        'autoScale': false,
        'transitionIn': 'elastic',
        'transitionOut': 'elastic',
        'type': 'iframe',
        'scrolling': 'no'
        });
    });
});

接下来,您调用要在fancybox中加载的网址:

<a class="mylightbox" href="/tabid/333/default.aspx?width=440&amp;height=650">my link text</a>

在这种情况下,我在我的网站中使用了本地页面。

答案 1 :(得分:0)

我知道这个答案有点晚了:-)

DNN可以(自DNN 7.2起)打包JavaScript库,然后通过以下方式将其加载到代码中

<%@ Register TagPrefix="dnn" TagName="JavaScriptLibraryInclude" Src="~/admin/Skins/JavaScriptLibraryInclude.ascx" %>
[...]
<dnn:JavaScriptLibraryInclude runat="server" Name="FancyBox" />

在ascx中,或

JavaScript.RequestRegistration("FancyBox")

在后面的C#代码中。

首先,您必须为JavaScript库创建一个包,这很容易做到。有关参考,请参见https://github.com/EngageSoftware/DNN-JavaScript-Libraries(如果在那里找到所需的软件包,则可以使用它,但我没有看到FancyBox)。

有关更多信息,请参见https://www.dnnsoftware.com/wiki/javascript-libraries

开心的DNNing!
迈克尔