Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

multiple selection list and png image

Posted on 2014-03-10
5
Medium Priority
?
431 Views
Last Modified: 2014-03-12
I have to create a multiple selection list which isn't a problem.  The problem is incorporating a png graphic of the button I want to use with it.  Any suggestions?
0
Comment
Question by:lrollins
5 Comments
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 39919385
Is this the submit button for the form?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39919408
Any suggestions?
A suggestion that you tell us what the problem is
0
 
LVL 1

Author Comment

by:lrollins
ID: 39920330
It's a drop down list of our products.  I don't know how to incorporate the png image into the coding for the selection list.  Below is a sample code.

<select>
<option>male</option>
<option>female</option>
<option>others</option>
</select>
Selects-Bar.jpg
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 750 total points
ID: 39921214
Well it is a pretty lame effect, but I think it might be possible for Firefox using the image as a background perhaps, but for anything really effective you might want to look around for some kind of jquery hack in a plugin. Generally you have to swap layers in and out if you want the image to work correct and display the selected value.

It is poor design and you will find users complain unless it is 100% reliable (good luck with that).  You might want to consider doing it using a list styled to look like a select, and using events to handle the click; otherwise you are going to run into all kinds of issues.  

I have seen various attempts at this but I have yet to see one that works reliable and cross browser; so the best you are going to find is something that sort of works part of the time for some browsers.

Cd&
0
 
LVL 1

Author Closing Comment

by:lrollins
ID: 39923338
You are correct.  After doing research, I've come to the conclusion that it will be easier to just do a simple selection list.  I'll make the other buttons fancy.  Thanks.
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question