开发者

HTML Input (type=image) not working on Firefox 4

<input  type="image"开发者_如何学Govalue="Delete" title="Delete" name="cmd_delete" src="bin/images/common/delete.png"/>

The above HTML code is for a Delete button in my application. The problem is that this button does not work in Firefox 4 but works in other browsers. Please how can I fix this.


You're basically abusing the <input type="image"> to have a button with a background image. The <input type="image"> represents an image map. The mouse position on the button is been sent as cmd_delete.x and cmd_delete.y parameters. But you are not interested in the mouse position. Replace it by a normal <input type="submit"> and use CSS to specify a background image. E.g.

<input type="submit" name="cmd_delete" class="delete" value="" />

with

input.delete {
    background-image: url('bin/images/common/delete.png');
    width: 20px;
    height: 20px;
    border: 0;
    cursor: pointer;
}

and check it as follows

if (isset($_GET['cmd_delete'])) {
    // Delete button pressed.
}


You could use <button name="cmd_delete" value=""><img src=".."/></button> instead of input.


Try:

<input type="button" class=”button” value="Delete" title="Delete" name="cmd_delete" />

.button{
      background: url('bin/images/common/delete.png') no-repeat top;
}


Following works in IE, FF (and IE6, BalusC!):

<input type="submit" value="" style="background-image: url('bin/images/common/delete.png');width:262px;height:37px;border:0;cursor: pointer;" />


Suppose:

<input type="image" name="submit" src="signout.png" />

If you are using php, change your code from

if(isset($_POST['submit']))

to

if(isset($_POST['submit_x']))`


Just check for $_REQUEST['submit_x'] if its set or not empty. Older browsers don't set $_REQUEST['submit'] when using input type image. Don't really know why...

Then there's no need to apply CSS to the tag.


The problem with using <button name="cmd_delete" value=""><img src=".."/></button> is that you still see the button behind the image. It looks horrible. Why is this negative voted...it is true, I tried it!

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜