Site icon CodeGurus

Fix Jasny File Input in Avant theme and IE / MS Edge

Applies to “Avant – Clean and Responsive Bootstrap 3.3.2 Admin” or Avant 1.4 (c) 2015 as written in readme.txt.

Open /HTML/assets/css/styles.css, find the following block:

.btn-file > input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  transform: translate(-300px, 0) scale(4);
  -webkit-transform: translate(-300px, 0) scale(4);
  font-size: 23px;
  height: 100%;
  width: 100%;
  direction: ltr;
  cursor: pointer;
}

Comment out the following lines:

/*  transform: translate(-300px, 0) scale(4);
  -webkit-transform: translate(-300px, 0) scale(4); */

Now Select file/image etc buttons should work in Internet Explorer 11 (as tested on 11.306.10586.0) and Microsoft Edge.

To make the examples in File Inputs section of the Form Components page work, open /HTML/form-components.htm and change:

<script type='text/javascript' src='assets/plugins/form-jasnyupload/fileinput.min.js'></script>

to:

<script type='text/javascript' src='assets/plugins/form-jasnyupload/fileinput.js'></script>

Now the controls and image preview are functioning.

Additionally the plugin could be upgraded to a more recent version, select “Download source code” and replace /HTML/assets/plugins/form-jasnyupload/fileinput.js and fileinput.less files with the ones from the downloaded archive. Upgrading to 3.1.3 makes “too much recursion”-errors disappear from the JS-console.

Exit mobile version