【H5 音乐播放实例】第六节 其他

简介: 【H5 音乐播放实例】第六节 其他

##1.3音乐简介

5.png

6.png

7.png

效果:

image.png

##1.4评论框和评论按钮

代码写在歌曲简介DIV的下面:


<!-- 用户评论 -->
<div style="width: 100%; min-height: 220px; z-index: 0;margin-top: 28px;" class="commentBox" contenteditable="true">
  <textarea id="commentInputBox"></textarea>
</div>

css:

9.png

效果:

10.png

发表评论的按钮

12.png13.png


效果:

14.png

##1.5 评论区域

15.png

css:

.comments {border: 1px dotted #666;margin-top:38px;}
.comments .comment {
  border: 1px dotted #666;
  height: 200px;
}
.comments .comment .c_left {
  width: 25%;
  border: 1px dotted #666;
  height: 100%;
  float: left;
  position: relative;
}
.comments .comment .c_right {
  width: 74%;
  height: 100%;
  float: left;
}
.comments .comment .c_right .c_contentBox {
  height: 160px;
}
.comments .comment .c_right .c_contentBox .c_content{
  padding:20px;
  color:#252424;
}
.comments .comment .c_right .c_bottom {
  height: 40px;
  border-top: 1px solid #8A8585;
}
.comments .comment .c_right .c_bottom .time {
  margin-left: 6px;
    line-height: 35px;
    color: #222;
}
.comments .comment .c_right .c_bottom .reply {
  float: right;
  margin: 8px 12px;
}
.comments .comment .c_right .c_bottom .reply a {
  text-decoration: none;
  color: #293F7D;
  font-weight: 600;
}

Html:

16.png

17.png


相关文章
|
3月前
|
图形学
【unity小技巧】Unity中实现一个战斗连击连招系统,可以动态添加减少连击连招段数功能
【unity小技巧】Unity中实现一个战斗连击连招系统,可以动态添加减少连击连招段数功能
53 0
|
4月前
|
XML Java 调度
Android开发音效增强中铃声播放Ringtone及声音池调度SoundPool的讲解及实战(超详细 附源码)
Android开发音效增强中铃声播放Ringtone及声音池调度SoundPool的讲解及实战(超详细 附源码)
226 0
|
移动开发 前端开发
【H5 音乐播放实例】第五节 音轨制作
【H5 音乐播放实例】第五节 音轨制作
118 0
|
移动开发
【H5 音乐播放实例】第四节 音乐详情页制作 -音乐的播放和暂停
【H5 音乐播放实例】第四节 音乐详情页制作 -音乐的播放和暂停
135 0
|
移动开发 前端开发
【H5 音乐播放实例】第三节 音乐详情页制作(3)
【H5 音乐播放实例】第三节 音乐详情页制作(3)
|
移动开发 前端开发 容器
【H5 音乐播放实例】第二节 音乐详情页制作(2)
【H5 音乐播放实例】第二节 音乐详情页制作(2)
|
移动开发 前端开发 JavaScript
【H5 音乐播放实例】第一节 音乐详情页制作(1)
【H5 音乐播放实例】第一节 音乐详情页制作(1)
119 0
播放视频时有残影、水纹的原因
播放视频时有残影、水纹的原因
160 0
|
开发工具 C++
C++音乐播放按钮的封装过程详解
1、准备工作:音乐、开发工具VS stdio及图形库工具 2、设计思路:先加载音乐,再通过点击不同的按钮执行不同的操作(播放音乐,暂停音乐、继续播放、结束播放) 绘制按钮我们通过一个按钮button类来操作,这样数据会存在一些必要的访问数据权限,并可以将多个函数声明写在同一个类中,调用只需使用 " 类名.函数名 “即可调用里面的函数