选定图像上的jQuery动画在本地工作，而不是远程工作

Question

在平铺图中有以下动画元素(视觉上)在它们的z轴上旋转…

http://sthera.com/modelos.php

，它是这样编码的(有点强制，如果想到一个更优雅的解决方案，我也会很感激)…

$(window).load(function () {
    imagesLoaded('.fixedWidth', function () {
        console.log("animation starting3");
        var locationClean = window.location.href.split('?')[0];
        var loc = locationClean.split('sthera/')[1];
        //alert (loc);
        if (loc == 'modelos.php' || loc == 'aislar.php') {
            //alert ("animation starting2");
            var duration = 300;
            var imgWidth = 123;
            var delayFactor = 60;
            var marginLeft = imgWidth / 2;
            //establecemos los valores de inicio
            $(".a1, .a2, .a3, .a4, .a5, .a6, .a7").css({
                'width': '0px',
                    'margin-left': marginLeft + 'px',
                    'opacity': '0'
            });
            $(".c1, .c2, .c3, .c4, .c5, .c6, .c7").css({
                'opacity': '0'
            });
            $(".a1").delay(1 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c1").delay(1 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a2").delay(2 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c2").delay(2 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a3").delay(3 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c3").delay(3 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a4").delay(4 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c4").delay(4 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a5").delay(5 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c5").delay(5 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a6").delay(6 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c6").delay(6 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
            $(".a7").delay(7 * delayFactor).animate({
                'width': imgWidth + 'px',
                    'margin-left': '0px',
                    'opacity': '1'
            }, duration);
            $(".c7").delay(7 * delayFactor + duration).animate({
                'opacity': '1'
            }, duration);
        }
    });
}); //end animation()
//JavaScript Document

其中.a1 ... .a7为分类图像。

这段代码在我的本地测试服务器上完美运行，但不能远程运行…

我认为这个问题可能与没有加载的图像有关$(document).ready…所以我使用了另一个用户推荐的imagesLoaded插件…使用JQuery预加载图像以获得图像的主色调…但没有成功。代码在图像加载后运行，但显然这不是问题所在。

Answer 1

您是否在控制台获得console.log("animation starting3"); ?我想知道脚本是否正在运行。loc最终是什么?我看到你注释掉了警报，也许服务器的url结构与本地的url结构不同，没有任何东西正在运行，因为loc是错误的或空的。