Dropzone.js 업로드 진행률 막대가 표시되지 않습니다.

Question

파일 업로드에 Dropzone.js를 사용하고 있으며 진행률 표시 줄이 나타나지 않는 것을 제외하면 완벽하게 작동합니다. 오류가 없습니다. 사이트의 프런트 엔드에 부트 스트랩을 사용하고 있습니다. 내가 크롬의 요소를 검사하는 경우

파일을 업로드 한 후, 나는 그 부모가 모두 0 픽셀의 높이를 가지고 참조 : 내가 수동으로 설정 한 경우

이상한 것은,이다 높이가 10px이면 0px로 유지됩니다. 인라인 너비와 높이를 설정하더라도 요소 검사기에서 너비와 높이가 0px로 유지됩니다. (dz-progress, 부모 div가 설정되면 변경 될 것입니다.)

가장 좋은 추측은 부트 스트랩 또는 jquery의 항목이 충돌하는 것입니다. 그러나 CSS로 해결할 수는 없습니다. CSS 문제 일지라도). 여기에 관련 코드가 있습니다. body 태그에 Dropzone을 Jquery로 인스턴스화하므로 브라우저 창 어디서나 파일을 드롭 할 수 있습니다.

<div id="upload"> 
Drag and drop anywhere on the page to upload, or click here to select files. 
</div> 
<div id="uploads"></div> 

<script src="bootstrap\js\jquery-2.1.0.min.js"></script> 
<script src="bootstrap\js\bootstrap.min.js"></script> 
<script src="bootstrap\js\dropzone.js"></script> 
<script type="text/javascript"> 
    $("body").dropzone({ url: "upload.php", maxFilesize: 10, previewsContainer: "#uploads", clickable: "#upload", paramName: "userfile", success: function(file, response){ alert("success: "+response); }, error: function(file, response){ alert("error: " +response); }, method: "post" }); 
</script> 

모든 아이디어를 얻을 수 있습니다.

Answer 1

해결. 이 CSS는 고정 dropzone.css에 추가 :

display: block 추가

.dz-upload { 
    display: block; 
    background-color: red; 
    height: 10px; 
    width: 0%; 
} 

는 스팬 폭을했다하지만 여전히 나타나지 않았다. 높이와 배경색을 추가하면 마침내 나타납니다. width: 0%을 추가하면 보이지 않게 시작되었습니다 (그렇지 않으면 전체 막대로 시작한 다음 진행이 시작될 때 뒤로 건너 뛰기 시작합니다).