audiojs width控制

https://github.com/kolber/audiojs

只需添加样式即可

<style>
    .audiojs .scrubber {
        background: none repeat scroll 0 0 #5A5A5A;
        border-bottom: 0 none;
        border-left: 0 none;
        border-top: 1px solid #3F3F3F;
        float: left;
        height: 14px;
        margin: 10px;
        overflow: hidden;
        position: relative;
        width: 100px; /* smaller width */
    }

    .audiojs .time {
        border-left: 1px solid #000000;
        color: #DDDDDD;
        float: left;
        height: 36px;
        line-height: 36px;
        margin: 0; /* no margin */
        padding: 0 6px 0 9px; /* 2px smaller left padding */
        text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
    }

    .audiojs {
        width: 100%;
        font-family: monospace;
        font-size: 10px; /* reduced font size */
    }

</style>

<style>

.audiojs .scrubber {

background: none repeat scroll 0 0 #5A5A5A;

border-bottom: 0 none;

border-left: 0 none;

border-top: 1px solid #3F3F3F;

float: left;

height: 14px;

margin: 10px;

overflow: hidden;

position: relative;

width: 100px; /* smaller width */

}

.audiojs .time {

border-left: 1px solid #000000;

color: #DDDDDD;

float: left;

height: 36px;

line-height: 36px;

margin: 0; /* no margin */

padding: 0 6px 0 9px; /* 2px smaller left padding */

text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);

}

.audiojs {

width: 100%;

font-family: monospace;

font-size: 10px; /* reduced font size */

}

</style>

关键就在于

 width: 100px; /* smaller width */

1	width: 100px; /* smaller width */

他控制进度条，因为进度条可能是你最想调整的地方

记录前端html5和css3.0技术

发表评论取消回复

发表评论 取消回复

发表评论取消回复