File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes HTML, CSS and JavaScript and the fly likes background image in button Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "background image in button" Watch "background image in button" New topic
Author

background image in button

pradeep anandan
Greenhorn

Joined: Jul 02, 2001
Posts: 25
Dear Friends,
When i give style="BACKGROUND-IMAGE for a button
it allows only for absoulete path only. I am not able to add the image in a relative path.
Can anybody has the solution.
Regards,
Pradeep
David O'Meara
Rancher

Joined: Mar 06, 2001
Posts: 13459

Sorry, I didn't understand. Can you paste some sample code for what ou are doing?
Dave.
pradeep anandan
Greenhorn

Joined: Jul 02, 2001
Posts: 25
Hi David
This is my code
<input type="button" name="BTN_LOV_FORMULA" style="BACKGROUND-IMAGE: url(file://H:\webapps\examples\jsp\Work\image\s_b_detl.gif) ; HEIGHT: 19px; WIDTH: 20px"
where the path of the image is the absoulete path.
where as my I need is a relative path like
<input type="button" name="BTN_LOV_FORMULA" style="BACKGROUND-IMAGE: url(file://..\image\s_b_detl.gif) ; HEIGHT: 19px; WIDTH: 20px"
for which I am not able to get the output of a image in the button.
Regards,
pradeep
ugo marino
Greenhorn

Joined: Sep 19, 2005
Posts: 1
try to write

<input type="button" name="BTN_LOV_FORMULA" style="BACKGROUND-IMAGE: url(../image/s_b_detl.gif); HEIGHT: 19px; WIDTH: 20px"
[ September 19, 2005: Message edited by: ugo marino ]
Jan Sterk
Ranch Hand

Joined: Jun 06, 2008
Posts: 139
Since this thread is 6 years old, I don't think the original poster minds that I'm stealing his thread

I have the following code:

editbutton.gif is in the same directory as the .jsp that contains the code. However, no luck. The button doesn't show the image. I tried numerous variations..
[ June 19, 2008: Message edited by: Jan Sterk ]

SCJP 1.4 (81%)<br />SCWCD 5 (95%)
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61653
    
  67

In the future, it would be best to start a new topic rather then resurrect a 6-year old zombie.
[ June 19, 2008: Message edited by: Bear Bibeault ]

[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61653
    
  67

In a web application, it's best not to use page-relative addressing. See this JSP FAQ entry.
Sean Bradshaw
Greenhorn

Joined: Jun 19, 2008
Posts: 2
I don't think the <input type="button"> tag is what you're looking for. There are a few options that would be more fitting. <input type="image" src="image.gif"> functions as a button but shows an image. Or even the HTML4 spec using the <button></button> tags then you can put an <img> tag or any other text content in there as well.

Really with Javascript events this is a user interface issue. Why do you want to use an input tag, is it because you need to send some data from that button to the next page? Or do you want the cursor to stay as an arrow rather than change to a hand like a normal link? Without it changing to a hand and without a hover effect of some sort, the user may not even realize it is a clickable link.

So I'd recommend something like this:



Well at least if you don't mind having your event logic inside your HTML page. To make that even more noticeable as an actionable link, you could add onmouseover="this.src='image-hover.gif';" onmouseout="image.gif" to the image tag to make it a little more dynamic.
[ June 19, 2008: Message edited by: Sean Bradshaw ]
Jan Sterk
Ranch Hand

Joined: Jun 06, 2008
Posts: 139
Thank you all for your replies.

I'm taking Sean's route with <href><button>. Strange thing is, the href works fine with .html links, but not with servlet links.

On a click event, I want to go to a (front controller) servlet. It needs a few request parameters, but that can be done by creating a query string with EL.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61653
    
  67

Originally posted by Jan Sterk:
Strange thing is, the href works fine with .html links, but not with servlet links.

That usually means that you are using page-relative URLs rather than proper server-relative URLs.

Remember, the browser has no notion of what the servlet mappings on the server are, so there really is no concept of a "current page" and URLs that are relative to it won't properly resolve.

See the JSP FAQ for more info.
Jan Sterk
Ranch Hand

Joined: Jun 06, 2008
Posts: 139
OK, problem solved. I used <href a=..> instead of <a href=..> Got no clue how I got the .html testlink working with it, or how I mixed things up..

Reading the url faq is a nice spin-off however, it is certainly a good practice to use relative url's.
 
Don't get me started about those stupid light bulbs.
 
subject: background image in button