Wall 插件无法工作,即使它位于 /thewall/(正确的目录)中

发布于 2024-11-25 16:26:43 字数 2310 浏览 1 评论 0原文

我正在尝试使用这个 mootools 插件,但它根本不起作用

这个插件来自这个 URL 我下载了该插件并尝试应用它,名为 /thewall/ 的文件夹位于右侧目录,我不知道为什么它不起作用

这里是插件的URL。

这是我的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>The Wall</title>

    <script type="text/javascript" src="demos/mootools-1.3.1/mootools-core-1.3.1.js"></script>
    <script type="text/javascript" src="demos/mootools-1.3.1/mootools-more-1.3.1.1.js"></script>
    <script type="text/javascript" src="source/wall.js"></script>

    <script type="text/javascript">

    // Define The Wall
    var maxLength    = 100; // Max Number images
    var counterFluid = 1;
    var wallFluid = new Wall("wall", {
                    "draggable":true,
                    "inertia":true,
                    "width":150,
                    "height":150,
                    "rangex":[-100,100],
                    "rangey":[-100,100],
                    callOnUpdate: function(items){
                        items.each(function(e, i){
                            var a = new Element("img[src=/thewall/"+counterFluid+".jpg]");
                                a.inject(e.node).fade("hide").fade("in");
                            counterFluid++;
                            // Reset counter
                            if( counterFluid > maxLength ) counterFluid = 1;
                        })
                    }
                });
    // Init Fluid Wall
    wallFluid.initWall();

    </script>



    <style>
    /* Minimal Css Required */
    #viewport{
        width:900px;
        height:450px;
        position:relative;
        overflow:hidden;
        margin:0 auto;
        background:#212121;
    }

    #wall{
        z-index:1;
    }
    </style>   
    </head>
    <body>

        <div id="viewport">
        <div id="wall">
        </div>
        </div>

    </body>
    </html>

I'm trying to use this mootools plugin but it doesn't work at all

This plugin is from this URL I downloaded the plugin and tried to apply it, the folder called /thewall/ is in the right directory, I have no idea why it's not working

Here is the URL of the plugin.

Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>The Wall</title>

    <script type="text/javascript" src="demos/mootools-1.3.1/mootools-core-1.3.1.js"></script>
    <script type="text/javascript" src="demos/mootools-1.3.1/mootools-more-1.3.1.1.js"></script>
    <script type="text/javascript" src="source/wall.js"></script>

    <script type="text/javascript">

    // Define The Wall
    var maxLength    = 100; // Max Number images
    var counterFluid = 1;
    var wallFluid = new Wall("wall", {
                    "draggable":true,
                    "inertia":true,
                    "width":150,
                    "height":150,
                    "rangex":[-100,100],
                    "rangey":[-100,100],
                    callOnUpdate: function(items){
                        items.each(function(e, i){
                            var a = new Element("img[src=/thewall/"+counterFluid+".jpg]");
                                a.inject(e.node).fade("hide").fade("in");
                            counterFluid++;
                            // Reset counter
                            if( counterFluid > maxLength ) counterFluid = 1;
                        })
                    }
                });
    // Init Fluid Wall
    wallFluid.initWall();

    </script>



    <style>
    /* Minimal Css Required */
    #viewport{
        width:900px;
        height:450px;
        position:relative;
        overflow:hidden;
        margin:0 auto;
        background:#212121;
    }

    #wall{
        z-index:1;
    }
    </style>   
    </head>
    <body>

        <div id="viewport">
        <div id="wall">
        </div>
        </div>

    </body>
    </html>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文