我爱编程

2018-04-09播放页面优化3

2018-04-09  本文已影响0人  鹿啦啦zz

在播放界面设置了我要学习和播放音乐两个按钮

播放音乐界面

我要学习界面

var learn = $('#learn')             //获取 我要学习 按钮
learn.on('click',function () {
    $('#geci').css('display','none')
    $('#divearnGeci').css('display','block')
    this.disabled=true;
    this.nextElementSibling.disabled = false;
    $('#audio').css('display','none')
}
$('#btnplayMusic').on('click',function () {
    $('#geci').css('display','block')
    $('#divearnGeci').css('display','none')
    this.disabled=true;
    this.previousElementSibling.disabled = false;
    $('#audio').css('display','initial')
})

重新解决了图片重叠问题

html部分
<div class="row"id="changpian">
    <img src="/public/img/changpian.png" id="imgcp"/>
    <img src="/public/img/星空.jpg" id="imga"/>
</div>
css部分
#changpian{
    position: relative;
}
#changpian img{
    border-radius: 50%;
}
#imga{
    position: absolute;
    width: 54%;
    top:21%;
    left:23%;
}
上一篇 下一篇

猜你喜欢

热点阅读