开发者

How do I replace the Submit Button with an Image? [jQuery jQtransform plugin]

I'm using a jQuery plugin called jQtransform (http://www.dfc-e.com/metiers/multimedia/opens开发者_C百科ource/jqtransform/) which skins HTML form elements like the input box and submit buttons. All is well until I need to use an image as the submit button. I tried the following CSS code but the original button still appears, and not the image.

CSS:

/* this is the submit button */
#search {   
    width: 32px;
    height: 32px;
    padding: 0px;
    margin: 0px;
    border: 0px;
    background: transparent url(../images/template/icons/search.png) no-repeat center top;
    overflow: hidden;
    cursor: pointer; /* hand-shaped cursor */
    cursor: hand; /* for IE 5.x */
}

HTML:

<input type="submit" name="search" value="Search" id="search" />

** HTML code looks like it has been processed by the jQuery plugin when viewed in Chrome's 'Inspect Element' feature. The above is the original HTML code as seen when you select 'View Page Source' in Chrome.

What should I do to replace the submit button with my own image? I'm not too good with jQuery...

UPDATE

GREAT! All the answers are working. I must have been thinking too much :)


This should work

<form>
<input type="image" src="[some image]" onsubmit="submitForm();" id="search">
</form>


How about using good old HTML <input type="image" ... />?


<img type="image" src="img src..." id="search" />
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜