Javascript 使用条件语句使jquery fadeIn/fadeOut仅在viewport>；=480px

我有以下代码，在图像和标题之间淡出：

setInterval(function(){
            $('.fadein-effect > img').fadeOut(2500, function(){
                $('.fadein-effect').append('<h2 class="intro-text">Site Currently Under Construction - Coming Soon!</h2>');
                $('.fadein-effect > h2').hide().fadeIn(2500).fadeOut(2500, function(){
                    $('.fadein-effect > h2').remove();
                    $('.fadein-effect > img').fadeIn(2500);
                });
            });  
        }, 10000);

setInterval（函数（）{
$（'.fadein effect>img'）.fadeOut（2500，函数（）{
$（'fadein effect'）.append（'Site current in-Construction-cooming！'）；
$（'.fadein effect>h2'）.hide（）.fadein（2500）.fadeOut（2500，函数（）{
$（'.fadein effect>h2'）.remove（）；
$（'.fadein效应>img'）.fadein（2500）；
});
});  
}, 10000);

我希望在响应性布局中使用此效果，并且只希望在视口=>480px时淡入淡出效果才起作用。我尝试过使用下面的方法（在许多其他方法中），但无法使其起作用

function fadeInEffect(){
    var $containerWidth = $(window).width();
    if ($containerWidth <= 480) {

        setInterval(function(){
            $('.fadein-effect > img').fadeOut(2500, function(){
                $('.fadein-effect').append('<h2 class="intro-text">Site Currently Under Construction - Coming Soon!</h2>');
                $('.fadein-effect > h2').hide().fadeIn(2500).fadeOut(2500, function(){
                    $('.fadein-effect > h2').remove();
                    $('.fadein-effect > img').fadeIn(2500);
                });
            });
        }, 10000);

    }
    else {
        $('.fadein-effect > img').replaceWith('<h2 class="intro-text">Site Currently Under Construction - Coming Soon!</h2>');
    } 
}

$(document).ready(function () {
    fadeInEffect();//run when page first loads
});

$(window).resize(function () {
    fadeInEffect();//run on every window resize
});

函数fadeInEffect（）{
var$containerWidth=$（window.width（）；
如果（$containerWidth您可以使用IE>=9支持的matchMedia API

if (window.matchMedia("(max-width: 480px)").matches) {
  // code executed once here
}

您的原始代码工作正常，只是在
if
语句中使用了错误的运算符。而不是使用“小于或等于”（
=
）

JSFiddle：

我希望这会有所帮助。^^
您的比较运算符是向后的。请使用
=
（大于或等于）而不是
。如果这解决了问题，请将我的答案标记为解决方案，以便其他人可以看到问题所在，并可能在他们的代码中识别问题^^
if ($containerWidth >= 480) {