Change Search Button "Go" to img |
Post Reply |
Author | ||
fidjiti
Senior Member Joined: 30-November-2006 Location: United States Status: Offline Points: 0 |
Post Options
Thanks(0)
Posted: 09-February-2007 at 12:17pm |
|
I would like to change the search button "go" in the pc/smallsearchbox.asp file. Here's the code it has right now.
<link href="pcHeaderFooter.css" rel="stylesheet" type="text/css"> <form action="showsearchresults.asp" name="search" method="get" class="pcForms"> <div align="center"> <input type="hidden" name="pageStyle" value="<%=bType%>"> <input type="hidden" name="resultCnt" value="10"> <input name="keyword" type="Text" size="25"> <input type="submit" name="submit" value="Go >>" id="submit" > </div> <div class="pcSmallText"> <div align="center"><a href="search.asp">advanced search</a></div> </div> </form> Any help would be greatly appreciated. I'm sure it's an easy img="" code but I just don't know where I'd put it. Sorry for the lack of knowledge here. |
||
Linda - I wish I knew ASP.
To view my ever evolving site click the "www" button below. :) |
||
netprofits
Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22 |
Post Options
Thanks(0)
|
|
Replace the following line:
with this code:
Make sure you change the image name, width and height to match your image. The a href tag just forces the cursor to change when you mouse over the image. The javascript submits the form when the image is clicked. |
||
fidjiti
Senior Member Joined: 30-November-2006 Location: United States Status: Offline Points: 0 |
Post Options
Thanks(0)
|
|
netprofits, has anyone ever told you, that you're awesome? Because you are! check out the site search on the top left. fidjiti.com
1 concern: If I type in the keyword and press ENTER then it searches properly. But if I type in the keyword and press TAB then ENTER it does nothing (by nothing i mean it only highlights the "go" button but doesn't actually return any results, but I do see a "#" at the end of the URL). Is it supposed to do that? I would like it to search on the TAB and ENTER too. Thanks again for your help. :) |
||
Linda - I wish I knew ASP.
To view my ever evolving site click the "www" button below. :) |
||
netprofits
Certified ProductCart Developers Joined: 05-January-2006 Location: United States Status: Offline Points: 22 |
Post Options
Thanks(0)
|
|
Thanks for the compliment. Try this code instead of the previous code:
Replace "search.gif" with the name of your image. |
||
fidjiti
Senior Member Joined: 30-November-2006 Location: United States Status: Offline Points: 0 |
Post Options
Thanks(0)
|
|
Awesome, it worked! Not that I ever doubted you. :)
But just a note to anyone else planning on doing this. In order to have the image show up as you've deisgned it with no border when selected, you can't have any borders in your CSS in the "form" section. You'll have to make sure you edit the following CSS styles in the /pc/pcStoreFront.css file. #pc FormsInput: border set to 0 and no color. #pc FormsInput Focus: border set to 0 and no color. Otherwise you'll get a border around your image. But I don't think it looks that bad. see here (I only chose to make a border on "Focus" because that way people know where they are while filling out forms): www.fidjiti.com To test it, make sure you enter a key word then press TAB and see how my button shows the border, if you don't like that make sure to set the Focus to "0" and no color. :) Thanks again for the awesome snipet of code. |
||
Linda - I wish I knew ASP.
To view my ever evolving site click the "www" button below. :) |
||
bottomlineusa
Newbie Joined: 18-August-2007 Location: United States Status: Offline Points: 0 |
Post Options
Thanks(0)
|
|
Hi,
I'm very glad to see this post on the borders around images. However, I can't seem to get rid of them. I've changed the/pc/pcStoreFront.css per your instructions but it is not working. Here is my revised code: pcForms input { border: 0; background-color: #F7F7F7; font-size: 11px; padding: 2px 3px 2px 3px; } .pcForms input:focus { border: 0; } Any help would be greatly appreciated. The borders do not look good on my site. Thank you! |
||
Justplaying
Newbie Joined: 16-August-2007 Location: United Kingdom Status: Offline Points: 0 |
Post Options
Thanks(0)
|
|
Hi I can replace the word go for an image easily but I cant align the input box and the image horizontally. Any ideas? Thanks Neil |
||
Post Reply | |
Tweet
|
Forum Jump | Forum Permissions You cannot post new topics in this forum You cannot reply to topics in this forum You cannot delete your posts in this forum You cannot edit your posts in this forum You cannot create polls in this forum You cannot vote in polls in this forum |