Question

我正在尝试在我的asp.net mvc视图中使用Fancybox，并在http://fancybox.net/blog上使用此示例6

我的HTML是：

<head>
    <title>Home Page</title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
</head>
<body>
    <div class="page">

        <div id="main">
            <link rel="stylesheet" type="text/css" href="../../Content/FancyBox/jquery.fancybox.css" />
<script type="text/javascript" src="../../Content/FancyBox/jquery.fancybox.js"></script>
<script>
    $(document).ready(function () {
        $("#dialog-user-login").trigger('click');       
    });
</script>

<div id="dialog-user-login">
    I am here
</div>

        </div>

    </div>
</body>

但在页面加载时未调用fancybox。我的代码中是否有任何遗漏？

[被修改

尝试了这个，但也没有奏效：

$(document).ready(function () {
    $("#dialog-user-login").fancybox({
        'showCloseButton'   : false,
        'titlePosition'         : 'inside',
        'titleFormat'       : formatTitle
    });
$("#dialog-user-login").trigger('click'); 
  });

Answer 1

使用jquery插件时，你应该在你想要的元素上调用它。

这是你如何为花式盒子做的

$(document).ready(function () {
    $("#dialog-user-login").fancybox({
        'showCloseButton'   : false,
        'titlePosition'         : 'inside',
        'titleFormat'       : formatTitle
    });
$("#dialog-user-login").trigger('click'); 
  });

Answer 2

尽可能多地发布此评论......

无论如何，对于DotnetSparrow，我最近自己创建了一个网站并实现了fancybox，它运行正常。

在前。 5＆amp; 6，我在我的页面上尝试过它也很好。

你的html缺乏很多，正如其他人评论的那样，你基于它的博客是片段，而不是整套教学......

请遵循以下内容：

1.首先遵循本指令的第一段：http://fancyapps.com/fancybox/#instructions

2.在HTML中

<a id="urLink" title="Login" href="#dialog-user-login">Login Here</a>  
<div id="dialog-user-login" style="display:none">
    I am here
</div>

3.在javascript中

<script type="text/javascript">
$(document).ready(function() {
    //attach fancybox on ur <a> tag
    $("#urLink").fancybox({
        'scrolling' : 'no',
        'titleShow' : false,
        'onClosed'  : function() { $("#login_error").hide(); }
    });

    //if you want to show the login in fancybox on load
    $("#urLink").trigger('click');
});
</script>

Answer 3

有点晚了，但我希望这能回答任何类似的问题：

$(function() {
    $.fancybox.open([{
        //o $("#myDiv").html() aunque este ultimo muestra los datos en bruto 
        content: $("#myDiv").text()
    }]);                
});

在页面加载时没有调用fancybox

3 个答案: