Hello,
What we would like to do is to replace the Browser default File Upload button with custom button, which button can be Image or CSS based.
How do we do this that works same across browsers?
And please note: the solution needs to be in Pure CSS & JS, this means NO Jquery.
I have searched for this online, but none of the solutions I found actually work.
Thank you,
Styling file-inputs is almost impossible because all browsers have a different UI for their file inputs and not much styling is allowed for this element.
The only option is to use JS to swap the file input for some normal css elements and then use js to talk between the original file input and the new faux input and act accordingly. It is not a simple task and complicated by security issues as you are not allowed access to the full file pathname in some browsers.
There are many examples on codepen (and elsewhere) and its a matter of choosing the right one for the browsers you want to support.
There seems to be more jquery based examples than raw JS but use much the same processes.
If you want full browser and old browser support then let the browser choose how it looks.
Ok, thanks.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.