时间戳

首页 > 解决方案 > 仅在主页上保留启用的 HTML 元素

javascript - 仅在主页上保留启用的 HTML 元素

问题描述

我有一个包含音频元素的 wordpress 网站，因此当有人访问该网站时会自动播放一首歌曲。它看起来像这样：

<figure><audio controls autoplay loop src="song-path.mp3"></audio></figure>

这是在自定义 HTML 小部件上。我需要这个标签只在主页上处于活动状态，所以我制作了这个 CSS：

audio, canvas, progress, video {
display: none;
 }

.home audio, canvas, progress, video {
display: inline-block;
}

使用这个 CSS，我可以在主页上保持音频处于活动状态并将其隐藏在所有其他页面中，但歌曲会继续由隐藏的播放器播放。

有没有办法完全禁用或静音除主页之外的所有页面的歌曲？

谢谢

标签： javascripthtmlcsswordpresshtml5-audio

解决方案

为什么你不只在主页上添加它？

if ( is_front_page() ) :
    the_widget( 'play_mp3_widget' );
else :
    the_widget( 'dontplay_mp3_widget' ); //* Or do Nothing *//
endif;

推荐阅读