美文网首页我爱编程
2018-04-09播放页面优化3

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

作者: 鹿啦啦zz | 来源:发表于2018-04-09 22:23 被阅读0次

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

    播放音乐界面

    我要学习界面

    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%;
    }
    

    相关文章

      网友评论

        本文标题:2018-04-09播放页面优化3

        本文链接:https://www.haomeiwen.com/subject/kcdwhftx.html