废话不多说了，直接看效果图吧。

效果图如下：

 html代码：

<div class="wrapper">

<h1 class="sub-section__title">eventType : </h1>

<div class="center" style="margin-top: 40px;">

<div id="trigger-2-hover" class="sound-trigger sound-trigger--type-default-2 sound-trigger--type-hover">

<p class="sound-trigger__speach">HOVER!</p>

<div class="sound-trigger__inner">

<i class="fa fa-volume-up fa-lg"></i>

</div>

</div>

<div id="trigger-2-click" class="sound-trigger sound-trigger--type-default sound-trigger--type-click">

<p class="sound-trigger__speach">CLICK!</p>

<div class="sound-trigger__inner">

<i class="fa fa-volume-up fa-lg"></i>

</div>

</div>

</div>