search

sconsult / croppic

croppic
914 stars 228 forks source link

Hide the form using css display instead of visibility #171

Open codaxe opened 9 years ago

codaxe commented 9 years ago

The visibility attribute keeps the element in the DOM flow and can cause UI artifacts.

jarodxxx commented 9 years ago

I had the same probleme, the solution is to add an width:0 ans height:0 in the .js file Line 142 replace:

var formHtml = '<form class="' + that.id + '_imgUploadForm" style="visibility: hidden; ">  <input type="file" name="img" id="' + that.id + '_imgUploadField">  </form>';

by 

 var formHtml = '<form class="' + that.id + '_imgUploadForm" style="visibility: hidden; height:0; width:0;">  <input type="file" name="img" id="' + that.id + '_imgUploadField">  </form>';
sconsult commented 8 years ago

The issue with display:none vs visibility:hidden is the compatibility with IE9 and EI10. I agree with your assessment, however we have decided to not merge this request based on the know compatibility issues.

I will leave it open as a reference for others with the same issue. Thank you for your contribution.