如何动态隐藏AMP页面中的div容器

问题描述 投票:1回答:1

是否有一些解决方案如何动态隐藏div容器?

这是我目前的实施:

<button class="button" on="tap:player.hide">hide me</button>
<button class=button" on="tap:player.show">show me</button>    
<div id="player" class="show" [class]="show||hide">some content</div>

.hide {
  display: none;
}

.show {
  display: block;
}

只要div类在初始调用中具有值'show',它就可以正常工作。但我想要的是只要没有点击按钮就禁用容器视图...

amp-html accelerated-mobile-page
1个回答
3
投票

Sebastian Benz用放大器回答:Click Here

您也可以在没有amp-bind的情况下实现目标

Here is working url

<button id="playerbutton1" class="button" hidden on="tap:player.hide,playerbutton1.hide,playerbutton2.show">hide me</button>
<button id="playerbutton2" class="button" on="tap:player.show,playerbutton2.hide,playerbutton1.show">show me</button>    
<div id="player" hidden>some content</div>
© www.soinside.com 2019 - 2024. All rights reserved.