javascript - .js 文件加载但不执行

标签 javascript jquery html css angularjs

<分区>

好的,这是我的问题。我从 youtube 上的教程中获得了一个图像 slider ,我不得不稍微更改它,因为我正在使用 Angular 并从数组中获取图像。如果我检查 google chrome 中的源,我的 slider.js 文件在那里,我的 css 等,一切都会加载......但是 slider 不起作用,它不会被激活是一个更好的方式来表达它:如果我将 slider.js 中的代码插入 chrome 控制台:按回车键 -> BOOOM 完美运行,我一直在寻找问题所在,尝试在脚本标签中添加 type="text/javascript",添加了(文档).ready 在我的 jquery 中,仍然没有...我将添加一些我的代码,希望这里的任何人都能发现问题!

slider.js 文件

'use strict';

$(document).ready(function() {

//settings for slider
var width = 320;
var animationSpeed = 1000;
var pause = 3000;
var currentSlide = 1;

//cache DOM elements
var $slider = $('.project-slider');
var $slideContainer = $('.slides', $slider);
var $slides = $('.slide', $slider);

var interval;

function startSlider() {
    interval = setInterval(function() {
        $slideContainer.animate({'margin-left': '-='+width}, animationSpeed, function() {

            if (++currentSlide === $slides.length) {
                currentSlide = 1;
                $slideContainer.css('margin-left', 0);
            }
        });
    }, pause);
}
function pauseSlider() {
    clearInterval(interval);
}

$slideContainer
    .on('mouseenter', pauseSlider)
    .on('mouseleave', startSlider);

startSlider();


});

最佳答案

app.directive("projectGallery", function(){
    return {
                restrict: 'E',
                templateUrl: "directives/project-gallery.html",
                controller: function(){
                                        this.current = 0;
                                        this.setCurrent = function(val){
                                            this.current = 0;
                                            if(val)
                                                this.current = val;
                                            };
                                        'use strict';

                                        $(document).ready(function() {

                                            //settings for slider
                                            var width = 320;
                                            var animationSpeed = 1000;
                                            var pause = 3000;
                                            var currentSlide = 1;

                                            //cache DOM elements
                                            var $slider = $('.project-slider');
                                            var $slideContainer = $('.slides', $slider);
                                            var $slides = $('.slide', $slider);

                                            var interval;

                                            function startSlider() {
                                                interval = setInterval(function() {
                                                    $slideContainer.animate({'margin-left': '-='+width}, animationSpeed, function() {

                                                        if (++currentSlide === $slides.length) {
                                                            currentSlide = 1;
                                                            $slideContainer.css('margin-left', 0);
                                                        }
                                                    });
                                                }, pause);
                                            }
                                            function pauseSlider() {
                                                clearInterval(interval);
                                            }

                                            $slideContainer
                                                .on('mouseenter', pauseSlider)
                                                .on('mouseleave', startSlider);

                                            startSlider();


                                        });
                                       },
                controllerAs: 'gallery',
           };
});

关于javascript - .js 文件加载但不执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32556567/

相关文章:

javascript - html5 localStorage将输入字段保存到键盘上的表单中

jquery - 使用HTML5播放音频文件

javascript - 表格布局,调整边距

php - 用户登录无法正常工作未知错误

javascript - 在 Javascript 中对整数数组执行计算

javascript - 在select中设置选中项

javascript - firebase.auth(...).signInWithEmailAndPassword 不是 Cloud Function 中的函数

javascript - ExpressJS 将变量传递给 JavaScript

javascript - 如果我没有将回调包装在 function() {} 中,则 jQuery.ajax() 调用成功,否则失败

html - LESS 从兄弟嵌套类继承