【羽图】《阳光的味道》

千羽

红影

羽儿的制作色彩明快艳丽，好美啊

红影

这个还带视频的，美丽的光影，让画面更有灵动感了

马黑黑

今天需要阳光。感谢感谢

马黑黑

其实还是应该给音频设置一个控制机制。比方讲，我现在用 Firefox 浏览器打开这个帖子，我的火狐是默认设置，不开启自动播放，这种情况下，访问者通常可能都不知道这个帖子有音乐。

可以给帖子父元素甚至是 document 设置一个点击事件，用以控制音频的播放暂停，代码放在帖子的最后面，就一句：

<script>
document.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>

这是点击浏览器视口区域任意地方都可播放/暂停音乐。若想通过帖子主元素点击操作，代码长酱紫：

<script>
mydiv.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>

红色部分是帖子主元素的id名称

樵歌

鲜红的太阳冉冉升起，光明温暖四面八方！看着这样美图，听着动人的音乐，沉醉其中了。

樵歌

羽儿实在太棒了

千羽

红影 发表于 2024-1-22 20:21
羽儿的制作色彩明快艳丽，好美啊

我昨天没看到这么炫目的光啊，今天改了下

千羽

红影 发表于 2024-1-22 20:21
羽儿的制作色彩明快艳丽，好美啊

我感觉mp4效果太过了，也没法再改小了，便去掉了

千羽

马黑黑 发表于 2024-1-22 22:05
其实还是应该给音频设置一个控制机制。比方讲，我现在用 Firefox 浏览器打开这个帖子，我的火狐是默认设置 ...

黑黑老师这样改的吗？

<style>
#mydiv { margin: 0 0 0 calc(50% - 881px);
display: grid;
place-items: center;
width: 1600px;
height: 1000px;
top:130px;
background: lightblue url('https://www.bohann.net/data/attachment/forum/202401/23/185424nahif4czahit1ral.jpg') no-repeat center/cover;
box-shadow: 3px 3px 20px #000;
user-select: none;
overflow: hidden;
position: relative;
z-index: 1;  
}
.mypic {
        position: absolute;
    right:  920px;
    top: 160px;
        cursor: pointer;
    mix-blend-mode: Multiply;
    z-index: 3;
    }
#vid {
        position: absolute;
        width: 100%;
        height: 110%;
        top:-80px;
        object-fit: cover;
        pointer-events: none;
        mix-blend-mode: screen;
        z-index: 2;
        opacity: .11;
}
</style>   
<div id="mydiv">
<div class="mypic"><img src="https://pic.imgdb.cn/item/62479cbe27f86abb2adbb9bd.gif" alt="" /></div>
<video id="vid" src="https://img3.tukuppt.com/video_show/2475824/00/07/99/5d149ee9eae95.mp4 " autoplay="" loop="" muted=""></video>
</div>  
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=5268184" autoplay="" loop=""></audio>
<script>
document.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>
<br><br><br><br><br><br><br><br>

马黑黑

千羽 发表于 2024-1-23 20:47
黑黑老师这样改的吗？

对，就在你的帖子代码的最后加的script，不过用帖子主体代替document的点击更好：

<script>
mydiv.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>

mydiv 是你帖子主元素的 id 名称

千羽

马黑黑 发表于 2024-1-22 22:05
其实还是应该给音频设置一个控制机制。比方讲，我现在用 Firefox 浏览器打开这个帖子，我的火狐是默认设置 ...

黑黑老师，我又改了

千羽

马黑黑 发表于 2024-1-23 20:50
对，就在你的帖子代码的最后加的script，不过用帖子主体代替document的点击更好：

谢谢黑黑老师，我今天收获不小，再次感谢啦

千羽

樵歌 发表于 2024-1-23 09:42
鲜红的太阳冉冉升起，光明温暖四面八方！看着这样美图，听着动人的音乐，沉醉其中了。

谢谢樵歌老师的美好文字

千羽

红影 发表于 2024-1-22 20:23
这个还带视频的，美丽的光影，让画面更有灵动感了

我把你和黑黑老师的mp4都收集了，都很喜欢，省我去找的时间了

千羽

马黑黑 发表于 2024-1-23 20:50
对，就在你的帖子代码的最后加的script，不过用帖子主体代替document的点击更好：

我以后就用这代码了，好高兴啊，再次谢谢黑黑老师

红影

千羽 发表于 2024-1-23 20:42
我感觉mp4效果太过了，也没法再改小了，便去掉了

看到还有啊，有视频的动态也挺好的。

红影

千羽 发表于 2024-1-23 21:10
我把你和黑黑老师的mp4都收集了，都很喜欢，省我去找的时间了

自己找的可能更喜欢啊，那里的视频真的不少呢，都很好看的