javascript 如何在通过PWA访问站点时禁用DIV

0kjbasz6  于 2023-06-28  发布在  Java
关注(0)|答案(1)|浏览(180)

我已经开发了一个网站,并希望使用它作为PWA(渐进式Web应用程序)以及。
但我想在PWA中隐藏特定元素。我尝试了CSS方法:

  1. @media all and (display-mode: standalone) {
  2. .noShowApp {
  3. display: none;
  4. }

}
JS方法:

  1. function isRunningStandalone() {
  2. return (window.matchMedia('(display-mode: standalone)').matches);
  3. }
  4. if (isRunningStandalone()) {
  5. alert('hi');
  6. hide(document.getElementById('features'));
  7. }

我在应用程序中得到了我的“警报”,但是我想隐藏的部分没有隐藏。
这是我想隐藏的部分:

  1. <section class="py-5 border-bottom noShowApp" id="features">

有人能告诉我如何让这些方法(CSS或JS)工作吗?我更喜欢CSS方法,但如果这是不可能的,JS也可以。

ia2d9nvy

ia2d9nvy1#

直接回复你的标题问题(因为你把标题和问题的内容搞混了)
如何在通过PWA访问站点时禁用DIV?

  1. @media all and (display-mode: standalone) {
  2. #divId {
  3. display: none
  4. }
  5. }

来自MDN,将显示模式视为standalone
应用程序的外观和感觉都像一个独立的应用程序。这可以包括具有不同窗口的应用、其在应用启动器中的自己的图标等。在这种模式下,用户代理将排除用于控制导航的UI元素,但可以包括其他UI元素,如状态栏。
manifest.json中,您必须具有

  1. {
  2. (...)
  3. "display": "standalone",
  4. "orientation":"portrait"
  5. }
展开查看全部

相关问题