ScrollTop 函数随屏幕宽度变化

Posted 2023-05-07

【中文标题】ScrollTop 函数随屏幕宽度变化

【英文标题】：ScrollTop function to change with Screen Width

【发布时间】：2021-10-25 09:52:51

【问题描述】：

您好，有人可以帮我写剧本吗？这段代码在 javascript 中运行良好：

    $("a[href='#tabs-11']").click(function()      
    $("html, body").animate( scrollTop: 620 , "slow");    
    return false;   
    );          

但现在我需要在使用此脚本调整屏幕大小但不起作用时执行不同的滚动高度：

    $("a[href='#tabs-11']").click(function() 
    $("html, body").animate( scrollTop: 620 , "slow");
    if (window.innerWidth < 700)  
        $("html, body").animate( scrollTop: 620 , "slow");
        return false;
    
    );

【参考方案1】：

试试看：

$("a[href='#tabs-11']").click(function(e) 
    e.preventDefault();
    if (window.innerWidth < 700) 
      $("html, body").animate( scrollTop: 20 , "slow");
      return false;
     else 
      $("html, body").animate( scrollTop: 1600 , "slow");
    
  );

您可以将 20 或 1600 更改为任何需要的值。

【讨论】：

感谢您的及时回复和知识分享。我现在没有收到任何错误，只是它似乎没有滚动到不同的高度，即使我将第二个函数更改为 scrollTop: 900 可能是 window.innerwidth 吗？尝试了 window.width 仍然没有结果它仍然使用第一个函数 scrollTop : 620？

【参考方案2】：

您需要在调整大小时添加一个事件侦听器，该函数将更新窗口宽度的状态。否则，您的代码无法理解您正在调整大小

【讨论】：

非常感谢你完美运行的兄弟！非常感谢您和您所爱的人如此友善和乐于助人！！好东西！

@ZeeMan 很高兴我的回答对您有所帮助！