Image change on Rollover

[LWolf]

I understand this is more of a css/javascript thing but I need a little help here. I have created a css button that I have added an icon image to that is an inactive version. When I hover I want the image to change to the color version. After searching the internet what I have found is not helping. Does anyone have any ideas here?


.btn1 {
width:175px;
background:#D4D4D4;
background:-moz-linear-gradient(top,#D4D4D4 0%,#7F7F7F 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#D4D4D4),color-stop(100%,#7F7F7F));
background:-webkit-linear-gradient(top,#D4D4D4 0%,#7F7F7F 100%);
background:-o-linear-gradient(top,#D4D4D4 0%,#7F7F7F 100%);
background:-ms-linear-gradient(top,#D4D4D4 0%,#7F7F7F 100%);
background:linear-gradient(top,#D4D4D4 0%,#7F7F7F 100%);
filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#D4D4D4', endColorstr='#7F7F7F',GradientType=0);
padding:10px 15px;
color:#fff;
font-family:'Helvetica Neue',sans-serif;
font-size:16px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border:1px solid #000;
margin-bottom: 15px;
}

.btn1:hover {
background:#5CCD00;
background:-moz-linear-gradient(top,#5CCD00 0%,#4AA400 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#5CCD00),color-stop(100%,#4AA400));
background:-webkit-linear-gradient(top,#5CCD00 0%,#4AA400 100%);
background:-o-linear-gradient(top,#5CCD00 0%,#4AA400 100%);
background:-ms-linear-gradient(top,#5CCD00 0%,#4AA400 100%);
background:linear-gradient(top,#5CCD00 0%,#4AA400 100%);
filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#5CCD00', endColorstr='#4AA400',GradientType=0);
padding:10px 15px;
color:#fff;
font-family:'Helvetica Neue',sans-serif;
font-size:16px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border:1px solid #459A00
}



<button type="submit" class="btn1" onclick="btn('myfunction');return false;"><img src="pp_i.png"> Presentation</button>
The hover button would be "pp_a.png".

Thank you in advance,
K

 

[spamjim]

If you understand this is not PHP, why are you posting in this PHP forum?

forum215

forum216