Jquery 窗口调整到一定宽度后淡入div内容

我试图产生一个功能，将基本上淡入一些内容后，页面已经通过了一个特定的窗口宽度。当前，每当窗口大小调整到小于、等于或大于1775像素时，下面的代码将运行淡入淡出。我想它淡入淡出的内容只有一次，当窗口宽度已达到1775像素，再次如果窗口宽度下降到1775像素以下

$(window).on('resize', function (event) { 
    if ($(window).width() >= 1775) {   
        $('.content-genre').hide().fadeIn(250);
} else {
    $('.content-genre').hide().fadeIn(250);
    }
});

---

如果您希望它在小于1775px和大于1775px的范围内淡入，您不希望它总是淡入吗

您只希望它在jQuery调用中单独存在：

$('.content-genre').hide().fadeIn(250);

---

否则，我就糊涂了

我做了一个jsfiddle，我想你想要的就是它。我使用了不同的数字，以便更容易看到。它切换到800而不是1775

以下是jquery：

var toggle = $(window).width() < 800;
$(window).on('resize', function (event) {
    $('#text').text($(window).width());
    if ($(window).width() >= 800 && toggle) {
        $('.content-genre').hide().fadeIn(1000);
        toggle = false;
    } else if ($(window).width() < 800 && !toggle) {
        $('.content-genre').hide().fadeIn(1000);
        toggle = true;
    }
});

var toggle=$（窗口）.width（）<800；
$（窗口）.on（'resize'，函数（事件）{
$（'#text'）.text（$（window.width（））；
如果（$（窗口）.width（）>=800&切换）{
$（'.content-genre'）.hide（）.fadeIn（1000）；
切换=假；
}else if（$（窗口）.width（）<800&&！切换）{
$（'.content-genre'）.hide（）.fadeIn（1000）；
切换=真；
}
});

---

基本上，我所做的只是在resize范围之外创建一个变量，跟踪事件发生的时间。如果这不是您想要的，请告诉我。

我希望当窗口重新调整大小大于1775像素时，以及当窗口重新调整大小小于1775像素时，内容淡入。您是否在不调整大小的情况下尝试过？只要保留if和else语句，我相信他希望每次超过阈值时，淡入只发生一次。一次说“你已经过了1775年！”一次说“你已经跌破了1775年！”。你拥有的（和他拥有的）会使它在每次调整窗口大小时不断褪色。至少，这是我的解释。请看我的答案，了解我的意思。好吧，如果这是他想要的，我肯定会感到困惑。我注意到，当页面最初加载的宽度超过1175时，在1775以下的第一次加载时，内容不会褪色。它将只工作，直到它是最大化以上1775再次，然后它会褪色。有什么原因吗？它假设宽度开始低于1775。我已经更新了JSFIDLE，无论页面的起始值是低于阈值还是高于阈值。记住将所有的'800'替换为您想要的宽度（在切换声明中现在有第三个）。