不需要插件,直接在 footer.php 文件的
之前放入以下代码就可以了,一个简单的实现方法。效果见本博客!
<style type="text/css">
#BGMusic p{position:fixed;bottom:32px;right:20px;border:1px dashed;padding:0px
5px;cursor:pointer;background:rgba(255,255,255,0.5);box-shadow:0 0 5px;border-radius:10px;}
#BGMusic p2{width:60px;height:50px;position:fixed;bottom:50px;right:25px;opacity:0;}
#BGM{position: fixed; right: -11px; bottom: 60px; list-style: none; border-top-left-radius: 15px;
border-top-right-radius: 15px; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px;
border: 1px dashed; padding-right: 15px; box-shadow: 0px 0px 5px; padding-left: 5px; padding-top:
6px;background: rgba(255,255,255,0.5);padding:5px;}
#BGM p1{position:absolute; left:-150px;width:250px;background:rgba(255,255,255,0.7);border-
radius:15px;box-shadow:0 0 5px;border:1px dashed;text-align:left;z-index:1500;padding:5px;}
</style>
<script>
function LC(){document.getElementById("BGM").style.display="";}
function LCh(){document.getElementById("BGM").style.display="none";}
function tent(){document.getElementById("WhenLittle10thLostRose").style.display="";}
function tenth(){document.getElementById("WhenLittle10thLostRose").style.display="none";}
function Bmt(){document.getElementById("ABlackManSaveWhiteGirl").style.display="";}
function Bmh(){document.getElementById("ABlackManSaveWhiteGirl").style.display="none";}
</script>
<div id="BGMusic" >
<p onmouseover="LC()" onmouseout="LCh()">music on</p>
<p2 onmouseover="LC()">The River</p2>
<div id="BGM" onmouseover="LC()" onmouseout="LCh()" style="display:none;">
<li onmouseover="tent()" onmouseout="tenth()"><iframe frameborder="no" border="0" marginwidth="0"
marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?
type=2&id=442319&auto=0&height=66"></iframe></li>
<p1 id="WhenLittle10thLostRose" onmouseover="tent()" onmouseout="tenth()"
style="display:none;bottom: 90px;"> 《天空之城》是由日本著名导演宫崎骏于 20 世纪 80 年代创作并上映的一部
经典动画作品,这部作品不仅取得了票房上的巨大成功,同时,不管在影片所折射出的深刻内涵还是作品的社会影响力上
影片都获得相当大的成就。</br>
</br>
</p1>
</div>
</div>
说明,由于本人对代码是一窍不懂,靠的是利用百度搜代码然后东拼西凑而成,对代码实现的原理和二次改修是完全不会,所以如果在使用本代码的过程中如果出现了什么问题我也是爱莫能助,还清自行解决。
哈哈,又学到一招,谢谢博主的无私分享
冬烛之焰 2020-09-22