javascript - Safari 移动版忽略 if else 语句的第一块

Question

由于某种原因，我的动画在 iphone 上不起作用。我试图通过定位 Safari 和任何宽度小于 500 像素的东西来使其工作。当 if 语句的第一个块独立时它工作正常但是当它在 else 语句中时，它忽略第一个块并尝试执行第二个块，即使它满足第一个块的条件（我知道是因为控制台.log 表示“横幅已启动”，它是“桌面”代码或 500 像素以上的任何内容的一部分）

我不知道为什么会这样做。那是野生动物园特有的东西吗？我该如何解决？

const mobileScreen = window.screen.width 

const is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;

console.log('javascript is working')



if (is_safari && mobileScreen <= 500 || mobileScreen <= 500) {
       function init() {
        console.log("Mobile Banner Initiated")

        TweenMax.set([viewport_mobile], { autoAlpha: 1 })

        TweenMax.set([d_letter_mobile], { x: -200, autoAlpha: 0 })

        TweenMax.set([o_letter_mobile], { x: 250, autoAlpha: 0})

        TweenMax.set([u1_letter_mobile, u2_letter_mobile], { y: -570 , autoAlpha: 0})

        frameOne();

    }

    init()

    function moveDown() {
        TweenMax.to([u2_letter_mobile], 1,  { y: 8, force3D: true, rotation: 0.01, z: 0.1, delay: 0.5 })
    }


    function frameOne() {

        TweenMax.to(d_letter_mobile, 1, { x: 0, force3D: true, rotation: 0.01, z: 0.1, autoAlpha: 1 })

        TweenMax.to(o_letter_mobile, 1, { x: 0, force3D: true, rotation: 0.01, z: 0.1, delay: 1.2, autoAlpha: 1 })

        TweenMax.to([u1_letter_mobile, u2_letter_mobile], 1, { y: 0, force3D: true, rotation: 0.01, z: 0.1, delay: 1.2, autoAlpha: 1, onComplete: moveDown })

        TweenMax.delayedCall(2.5, frameTwo);

    }

    function frameTwo() {
        
        TweenMax.to([headphones_mobile], 0.1, { autoAlpha: 1, delay: 1.5 })
        TweenMax.to([u1_letter_mobile], 0.1, { autoAlpha: 0, delay: 1.499 })

        TweenMax.to([bike_mobile], 0.1, { autoAlpha: 1, delay: 2 })
         TweenMax.to([u2_letter_mobile], 0.1, { autoAlpha: 0, delay: 1.999 })

        TweenMax.delayedCall(2.5, frameThree);

    }


    function frameThree() {

        TweenMax.set(headphones_mobile, { autoAlpha: 0, delay: 0.5 })
        TweenMax.to([u1_letter_mobile], 0.1, { autoAlpha: 1, delay: 0.501 })

        TweenMax.to(bike_mobile, 0.1, { autoAlpha: 0, delay: 1.0})
        TweenMax.to(u2_letter_mobile, 0.1, { autoAlpha: 1, delay: 1.001})

        TweenMax.to(sunglasses_mobile, 0.1, { autoAlpha: 1, delay: 2 })
        TweenMax.to([u1_letter_mobile], 0.1, { autoAlpha: 0, delay: 2.001 })

        TweenMax.to(icecream_mobile, 0.1, { autoAlpha: 1, delay: 2.5 })
        TweenMax.to(u2_letter_mobile, 0.1, { autoAlpha: 0, delay: 2.501})

        TweenMax.to(otext_mobile, 0.1, { autoAlpha: 1, delay: 3.0 })
        TweenMax.to(o_letter_mobile, 0.1, { autoAlpha: 0, delay: 3.001 })

    } 
} else {

    function init() {
       console.log("Banner Initiated")
    
       TweenMax.set([viewport], { autoAlpha: 1 })
    
       TweenMax.set([d_letter], { x: -400, autoAlpha: 0 })
    
       TweenMax.set([o_letter], { x: 450, autoAlpha: 0 })
    
       TweenMax.set([u1_letter, u2_letter], { y: 570  })
    
       frameOne();
    
    }
    
    init()
    
    function moveDown() {
       TweenMax.to([u2_letter], 1, { y: 26, force3D: true, rotation: 0.01, z: 0.1 })
    }
    
    
    
    function frameOne() {
    
       TweenMax.to(d_letter, 1, { x: 0, force3D: true, rotation: 0.01, z: 0.1, autoAlpha: 1 })
    
       TweenMax.to(o_letter, 1, { x: 0, force3D: true, rotation: 0.01, z: 0.1, delay: 0.9, autoAlpha: 1 })
    
       TweenMax.to([u1_letter, u2_letter], 1, { y: 0, force3D: true, rotation: 0.01, z: 0.1, delay: 1.2, autoAlpha: 1, onComplete: moveDown })
    
       TweenMax.delayedCall(2.5, frameTwo);
    
    }
    
    function frameTwo() {
    
       TweenMax.to([headphones], 0.1, { autoAlpha: 1, delay: 1.5 })
       TweenMax.to([u1_letter], 0.1, { autoAlpha: 0, delay: 1.499 })
    
       TweenMax.to([bike], 0.1, { autoAlpha: 1, delay: 2 })
        TweenMax.to([u2_letter], 0.1, { autoAlpha: 0, delay: 1.999 })
    
       TweenMax.delayedCall(2.5, frameThree);
    
    }
    
    
    function frameThree() {
    
       TweenMax.set(headphones, { autoAlpha: 0, delay: 0.5 })
       TweenMax.to([u1_letter], 0.1, { autoAlpha: 1, delay: 0.501 })
    
       TweenMax.to(bike, 0.1, { autoAlpha: 0, delay: 1.0})
       TweenMax.to(u2_letter, 0.1, { autoAlpha: 1, delay: 1.001})
    
       TweenMax.to(sunglasses, 0.1, { autoAlpha: 1, delay: 2 })
       TweenMax.to([u1_letter], 0.1, { autoAlpha: 0, delay: 2.001 })
    
       TweenMax.to(icecream, 0.1, { autoAlpha: 1, delay: 2.5 })
       TweenMax.to(u2_letter, 0.1, { autoAlpha: 0, delay: 2.501})
    
       TweenMax.to(otext, 0.1, { autoAlpha: 1, delay: 3.0 })
       TweenMax.to(o_letter, 0.1, { autoAlpha: 0, delay: 3.001 })
    
    }

}

标签： javascriptsafarimobile-safari