hey guys, is it possible to use paypal's buy now button generator code and give it a css valid rollover? normally i do rollovers like this:

#navButton {
     position: absolute;
     width: 200px;
     height: 80px;
     margin-top: 0px;
     margin-left: 0px;
     z-index: 2;
}

a.navButton {
     display: block;
     width: 200px;
     height: 80px;
     outline: none;
     background-image: url(../images/navWeek.jpg);
     background-repeat: no-repeat;
     background-position: 0px 0px;
     z-index: 2;
}
	 
a.navButton:hover {
     background-position: 0px -80px;
     z-index: 2;
}

the paypal generator gives you this code:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
     <input type="hidden" name="cmd" value="_s-xclick">
     <input type="hidden" name="hosted_button_id" value="blah blah blah">
     <input type="image" src="http://www.yoursite.com/navButton.jpg" name="submit" alt="">
     <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif">
</form>

i tried a bunch of different ways and couldn't figure out how to make that button hover! any help would be greatly greatly appreciated. thanks!

i'm not crazy. i'm just sane in a crazy world!

[Nutrox]

You could take the button input element out of the form and create a standard link to submit the form.

<a id="ppbutton" href="#" onclick="document.getElementById('ppform').submit();return false"></a>

Just give the form a ppform ID. Normally I wouldn't have the JS on the link like that but hey-ho.

[midnite]

sweet! thanks dude, worked like a charm. i was trying to put a hover class on the image with no luck.

this worked:

<div id="navButton">
    <form id="ppform" action="https://www.paypal.com/cgi-bin/webscr" method="post">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="hosted_button_id" value="blah blah blah">
    <a class="navButton" href="#" onclick="document.getElementById('ppform').submit();return false"></a>
    </form>
</div>

thanks again

[midnite]

by the way, any idea what this does?

<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">

the paypal generator adds that in, but i can't see what it's purpose would be other then as a tracker of sorts to see how many times that gif has been downloaded? just want to make sure it's safe to remove that.

[Nutrox]

I have no idea what that does to be honest but I imagine it is some kind of tracker as you mentioned. The only thing I can suggest is commenting it out and testing the form through PayPal's sandbox if you are using one, if everything works properly then I guess there is no harm removing that image (it doesn't get sent with the form anyway).