voice.html 1.0 KB

123456789101112131415161718192021222324252627282930
  1. {extend name='wechat@api/review/main'}
  2. {block name='content'}
  3. <div class="header"><span>{:date('H:i')}</span></div>
  4. <div class="container">
  5. <div class="logo">A</div>
  6. <div class="content arrow">
  7. <a class="icon icon-volume left-text"></a>
  8. <a href="javascript:void(0)" id="audio_btn" class="icon icon-pause"></a>
  9. <audio id="audio"><source src="{$url|default=''}"></audio>
  10. <script>
  11. var audio = document.getElementById('audio');
  12. var button = document.getElementById('audio_btn');
  13. setInterval(function () {
  14. button.className = audio.paused ? 'icon icon-play' : 'icon icon-pause';
  15. }, 500);
  16. button.onclick = function () {
  17. audio.paused ? audio.play() : audio.pause()
  18. }
  19. </script>
  20. </div>
  21. </div>
  22. {/block}
  23. {block name='style'}
  24. <style>
  25. .left-text{margin:0!important;color:#ccc!important}
  26. .icon{color:#666;font-size:1.5rem;margin-left:2.5rem;line-height:1.5rem}
  27. </style>
  28. {/block}