Question

我创建了一个图像滑块，图像从左向右移动，我希望当用户将鼠标移过它们时增加它们的大小，同时在鼠标离开时减小它们的大小。这有效，但只有一次。我认为这可能与我如何声明事件监听器有关。这是一个工作示例：（http://www.public.asu.edu/~drwarner/imageslider/scrolling_Banner.html），这是我的代码：

<script>
    var images = [];
    var imagePosition = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
    var cycle;
    var hoverImagePosition;

    window.onload = function scrolling() {
        for (i = 0; i < 10; i++) {
            images.push(document.getElementById("scrollingImage" + i));
            if (document.addEventListener) {
                // For all major browsers, except IE 8 and earlier
                document.getElementById("scrollingImage" + i).addEventListener("mouseenter", imageBigger);
                document.getElementById("scrollingImage" + i).addEventListener("mouseleave", imageSmaller);
            } else if (document.attachEvent) {
                // For IE 8 and earlier versions
                document.getElementById("scrollingImage" + i).attachEvent("mouseenter", imageBigger);
                document.getElementById("scrollingImage" + i).attachEvent("mouseleave", imageSmaller);
            }
        }
        cycle = setInterval(frame, 100);
    };

    function frame() {
        for (x = 0; x < 10; x++) {
            if (imagePosition[x] == 100) {
                imagePosition[x] = 0;
            } else {
                imagePosition[x] = imagePosition[x] + 1;
                images[x].style.left = imagePosition[x] + '%';
            }
        }
    }

    function imageBigger() {
        clearInterval(cycle);
        this.style.zIndex = 1;
        this.style.width = 25 + "%";
        hoverImagePosition = parseInt(this.style.left) - 2.5;
        this.style.left = hoverImagePosition + "%";
    }

    function imageSmaller() {
        cycle = setInterval(frame, 100);
        this.style.zIndex = -1;
        this.style.width = 20 + "%";
        hoverImagePosition = parseInt(this.style.left) + 2.5;
        this.style.left = hoverImagePosition + "%";
    }

</script>

Answer 1

我认为答案与你在imageSmaller中设置zIndex = -1有关。这可能会使图像落后于div / what，以及它为什么不能再次运作

Answer 2

将int *computeSquares(int &n) { int *arr = new int[10]; n = 10; for (int k = 0; k < n; k++) arr[k] = (k + 1) * (k + 1); return arr; }更改为0而不是-1

＆＃13;

z-index

＆＃13;

        var images = [];
        var imagePosition = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
        var cycle;
        var hoverImagePosition;
        
        window.onload = function scrolling() {
            for (i = 0; i < 10; i++) {
                images.push(document.getElementById("scrollingImage" + i));
                if (document.addEventListener) {
                    // For all major browsers, except IE 8 and earlier
                    document.getElementById("scrollingImage" + i).addEventListener("mouseover", imageBigger);
                    document.getElementById("scrollingImage" + i).addEventListener("mouseout", imageSmaller);
                } else if (document.attachEvent) {
                    // For IE 8 and earlier versions
                    document.getElementById("scrollingImage" + i).attachEvent("mouseenter", imageBigger);
                    document.getElementById("scrollingImage" + i).attachEvent("mouseleave", imageSmaller);
                }
            }
            cycle = setInterval(frame, 100);
        };

        function frame() {
             for (x = 0; x < 10; x++) {
                if (imagePosition[x] == 100) {
                    imagePosition[x] = 0;
                } else {                        
                    imagePosition[x] = imagePosition[x] + 1;
                    images[x].style.left = imagePosition[x] + '%';
                }
            }
        }
        
        function imageBigger() {
            clearInterval(cycle);
            this.style.zIndex = 1;
            this.style.width = 25 + "%";  
            hoverImagePosition = parseInt(this.style.left) - 2.5;
            this.style.left = hoverImagePosition + "%";
        }

        function imageSmaller() {
            cycle = setInterval(frame, 100);
            this.style.zIndex = 0;
            this.style.width = 20 + "%";    
            hoverImagePosition = parseInt(this.style.left) + 2.5;
            this.style.left = hoverImagePosition + "%";
        }

＆＃13;

mouseenter / mouseleave只工作一次

2 个答案: