javascript - 仅在桌面计算机上显示 DOM 元素时如何避免闪烁？

Question

我只想在用户使用台式计算机时显示 DOM 元素。不是根据屏幕的尺寸； 1300 像素宽的台式电脑需要显示该元素，而 1366 像素宽的 iPad 则不需要。

我目前的解决方案是下面的 jQuery 代码:

    $( document ).ready(function() {
        if($.browser.mobile) {
            $("#desktop-only").remove();
        }
    });

它有效，但它意味着 #desktop-only 元素闪烁。

任何类似于使用 /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) 的东西仍然闪烁。

肯定有更好的解决方案吗？

Answer 1

写问题启发了解决方案...

如果用户在移动设备上，我不会从 DOM 中删除元素，而是在元素上设置 display: none;，然后在用户不在移动设备上时显示它。

    $( document ).ready(function() {
        if(!$.browser.mobile) {
            $("#subscription-web").css("display", "block");
        }
     });

移动设备上不再闪烁，元素会弹出到桌面上的 View 中。所以它仍然有点闪烁，但以一种不那么令人讨厌的方式。

欢迎任何更好的解决方案!