Home/ Questions/Q 6761449
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T14:11:33+00:00

I’m using a script which replaces the usual file upload input with whatever image

  • 0

I’m using a script which replaces the usual file upload input with whatever image you want and then with JS makes sure that an invisible ‘browse’ button is underneath the mouse pointer whenever the mouse is moved over the image you want to use.

It works in ie7 ie8 ie9 Firefox, Safari, Chrome but not on Opera. On Opera the regular file input appears.

I know there are loads of scripts which do similar things, but either they are too complicated for me to figure out how to use them (eg uploadify) or they do similar things but just not as well – like making the custom image the same size as the file input would be (there’s issues with that too).

Here’s the script I’m using – there’s not much to it

How come it doesn’t work in Opera. Is there anyway to fix it? This is perfect for what I want apart from not working in Opera.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Interesting case, shows an Opera layout bug I wasn’t aware of: if a file input with opacity set to 0 is moved so that the text area part of the input is outside of the parent, the input will become visible. I will report a bug for this issue and follow up.

    To work around this and make the script work, you can do this:

    1. First remove or alter the Opera sniffing that disables the script. Find this:

      if (window.opera ||

      and remove window.opera || .

    2. Add a small workaround that will change the positioning of the file input and avoid placing it so far to the left that the text area part is hidden and opacity is ignored. Before this:

      this.file.style.left = x – (w – 30) + ‘px’;

      Add this line:

      if(window.opera && parseFloat(opera.version())>11.50 && (x-(w-30)<0))w=w/2;

    I’ve limited that to run only in Opera, and only in 11.50 and greater. The reason is that most older Opera versions do not open the file dialog if you click the “text input” part. In Opera versions less than 11.50 you will thus get the buggy display (but the functionality will work).

    I hope this helps you work around the bug. Whether it is future-proof I have no idea. The file input might see some changes in the future.

    • 0