响应式Jquery上传预览div

时间:2018-01-11 04:17:57

标签: jquery html css responsive

我正在使用这个真棒upload Preview jQuery plugin,但我很难让它具有移动响应能力。 我尝试添加img-responsive类,设置最大宽度以及我在互联网上找到的其他一些东西,但没有运气。

当页面缩小时,有没有办法让这个div响应?

HTML

<div class="col-md-6">
    <div id="image-preview">
        <label for="image-upload" id="image-label">Choose File</label>
        <input type="file" name="primary-item-photo" id="image-upload" required>
    </div>
</div>

CSS

#image-preview {
    max-height: 320px;
    max-width: 320px;
    height: 320px;
    width: 320px;
    overflow: hidden;
    background-image: url("../../images/icons/primary-photo-default.PNG");
    background-size: cover;
}

的jQuery

 $.uploadPreview({
        input_field: "#image-upload",
        preview_box: "#image-preview",
        label_field: "#image-label"
    });

0 个答案:

没有答案