Solved

button change on hover

Posted on 2011-03-10
2
270 Views
Last Modified: 2012-05-11
I am trying to have the image button change on hover, but it is not working.  Can someone please show me where my mistake is?  thanks

css
.update_btn	{
	width:83px;
	height:23px;
	background:url("../images/update_btn.jpg");
	cursor:pointer;
	left: 671px;
	}
	
.update_btn:hover {
	background: url("../images/update_btn1.jpg");
	}

Open in new window



body
<form action="edit_settings_parse.php" method="post">
          <tr>
            <td width="24%">Your Current Password: </td>
            <td colspan="2"><input name="current_pass" type="password" id="current_pass" size="28" maxlength="32" /></td>
          </tr>
          <tr>
            <td width="24%">Create New Password: </td>
            <td colspan="2"><input name="new_pass1" type="password" id="new_pass1" size="28" maxlength="32" /></td>
          </tr>
          <tr>
            <td>Confirm  New Password: </td>
            <td width="66%"><input name="new_pass2" type="password" id="new_pass2" size="28" maxlength="32" /></td>
            <td width="10%"><div class="update_btn"><input name="parse" type="hidden" value="passchange" />
			<input name="submit" type="submit" value="" /></div></td>
          </tr>
        </form>

Open in new window


As soon as I change the type to image, the custom image displays, but I lose functionality.
0
Comment
Question by:MsKrissy
2 Comments
 
LVL 5

Accepted Solution

by:
wmadrid1 earned 400 total points
ID: 35106265
<input name="submit" type="submit" value="" class="update_btn">

or

#update_btn input {
        width:83px;
        height:23px;
        background:url("../images/update_btn.jpg");
        cursor:pointer;
        left: 671px;
        }
       
#update_btn input:hover {
        background: url("../images/update_btn1.jpg");
        }
0
 

Author Closing Comment

by:MsKrissy
ID: 35110460
thank you wmadrid,
I went with adding the class
0

Featured Post

Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

Join & Write a Comment

Popularity Can Be Measured Sometimes we deal with questions of popularity, and we need a way to collect opinions from our clients.  This article shows a simple teaching example of how we might elect a favorite color by letting our clients vote for …
Showing your events from Google Calendar in Google Maps Why? I travel all week and I thought it would be ideal if staff in office knew where I was based on my calendar. (OK real reason: my son wanted to see where I would be working, and I thoug…
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…

746 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

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now