fancybox2的问题 - $ .fancybox.resize不是函数 - 错误

时间:2012-06-06 08:22:08

标签: javascript jquery html fancybox

的Javascript

/*Corner by Arthur Wulf White
jquery,  jquery ui and jeditable required
*/
$(document).ready(function()
{
    $("a.magicInput").click(function(e){
        e.preventDefault();
        $("ol.addItems").append('<li>Something</li>');
        $.fancybox.resize();
    });
    $("a.fancy").fancybox(       
    {
        'scrolling' : 'no',
        'autoScale' : true,
        'autoDimensions' : true

    });
    return false;
});

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8 />
        <title>
            studyWise - Log in
        </title>
        <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
    <script type="text/javascript" src="js/fancy/jquery.fancybox.js"></script>
    <script type="text/javascript" src="js/fancy.js"></script>

        <link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
        <link rel="stylesheet" href="js/fancy/jquery.fancybox.css" type="text/css" media="screen" />    

    </head>
    <body>
        <div id="wrap">
<div id="menu">
    <a class="fancy" href="#fancybox">Open</a>
</div>
<div id="main">
    <div class="secret">
        <div id="fancybox">
            <a class="magicInput" href="">Ok</a>
            <ol class="addItems">

            </ol>
        </div>
    </div>
</div>
</html>

结果:

$.fancybox.resize is not a function
[Break On This Error]   

$.fancybox.resize();

fancy.js (line 9)
$.fancybox.resize is not a function
[Break On This Error]   

$.fancybox.resize();

fancy.js (line 9)
$.fancybox.resize is not a function
[Break On This Error]   

$.fancybox.resize();

fancy.js (line 9)
$.fancybox.resize is not a function
[Break On This Error]   

$.fancybox.resize();

我想要的只是一个工作示例,其中fancybox扩展/拉伸以适应其中的整个列表。谢谢 - 它应该只是jsfiddle中的一两行,请帮助因为我不知道为什么它不起作用。

2 个答案:

答案 0 :(得分:12)

您使用的是fancybox v2.x 。此版本的选项是新的,与以前的版本(1.3.x)不兼容。

$.fancybox.resize() 不是 fancybox v2.x的有效方法,而是使用$.fancybox.update()autoScaleautoDimensions的情况相同,这是v1.3.x的选项

检查http://fancyapps.com/fancybox/#docs以获取您正在使用的版本的正确选项集。

答案 1 :(得分:-2)

How do you resize Fancybox at runtime?

FancyBox resize width

我猜这会对你有所帮助。从这些错误中可以清楚地看出,缺少任何JS文件。