|
|

楼主 |
发表于 2022-1-17 20:59
|
显示全部楼层
代码为我所有,还需动动手术刀。以下是帖子实例代码(全):
- <style type="text/css">
- .mBox {
- position: relative;
- left: -304px;
- top: 100px;
- width: 1200px;
- min-height: 300px;
- box-shadow: 2px 2px 4px 1px rgba(0,0,0,.2);
- background: transparent;
- }
- .sBox {
- background: #aaa;
- text-align: center;
- }
- .sBox h2, p { padding: 10px; }
- .marq {
- margin: 10px auto;
- position: relative;
- top: -620px;
- left: -120px;
- width: 50%;
- animation: goNow 10s linear infinite alternate;
- }
- @keyframes goNow {
- from { transform: translate(0,0); }
- to { transform: translateX(-50%); }
- }
- .btnDiv {
- position: relative;
- width: 32px;
- height: 32px;
- border: none;
- background: #035575;
- border-radius: 50%;
- box-shadow: 1px 1px 1px 0px rgba(0,0,0,.5);
- cursor: pointer;
- }
- .btnDiv:hover {
- opacity: .8;
- box-shadow: 1px 1px 2px 1px rgba(0,0,0,.5);
- }
- .btnDiv:active {
- opacity: .8;
- box-shadow: 1px 1px 1px 0px rgba(0,0,0,.9);
- }
- .btn-play {
- position: absolute;
- width: 0px;
- height: 0px;
- border: 10px solid #000;
- border-top-color:transparent;
- border-right-color:transparent;
- border-bottom-color:transparent;
- border-left-color:#eee;
- left: 12px;
- top: 6px;
- }
- .btn-pause {
- position: absolute;
- display:none;
- width: 2px;
- height: 20px;
- border-right: 4px solid #eee;
- border-bottom:0px;
- border-left: 4px solid #eee;
- left: 11px;
- top: 6px;
- }
- </style>
- <div class="mBox">
- <div class="sBox">
- <img src="https://638183.freep.cn/638183/Pic/xuehua.jpg" alt="" />
- </div>
- </div>
- <h2 class ="marq">阿尔法 - 中国(维语版)</h2>
- <audio id="ymusic" src="http://www.kumeiwp.com/sub/filestores/2021/09/26/ef22b4ac5961fdf344558aa51a913d6f.mp3"></audio>
- <div id="btnDiv" class="btnDiv">
- <div id="btn-play" class="btn-play"></div>
- <div id="btn-pause" class="btn-pause"></div>
- </div>
- <script language="javascript">
- //JS代码
- var mu = document.getElementById('ymusic');
- var btn = document.getElementById('btnDiv');
- var playbtn = document.getElementById('btn-play');
- var pausebtn = document.getElementById('btn-pause');
- btn.onclick = function(){ iplay(1); }
- mu.addEventListener("ended", function(){ iplay(0); })
- function iplay(flag){
- if(flag==1){
- mu.paused ? (mu.play(), playbtn.style.display="none", pausebtn.style.display="block") : (mu.pause(), playbtn.style.display="block", pausebtn.style.display="none");
- }else{
- playbtn.style.display= "block";
- pausebtn.style.display = "none";
- }
- }
- </script>
复制代码 链接:https://www.huachaowang.com/thread-56156-1-1.html
|
|