HTML - How Do I Make A Button Change Images

Hello, I am not familiar with coding of any sort, so if someone could just paste the appropriate code for my needs, it would be a lifesaver! And then I could just edit to fit my context...

I want a selection form using what you all refer to all "radio options". However, when someone clicks on an option, I want an image off to the side of the option to change. So each selection would have a different image to appear.

Is there any type of general code anyone could paste that would do that and I could just edit the image location and options, etc?

Thank you all for all your help and time!

Hi Here is my site;

http://www.freewebs.com/jonnibravo/

The icons at the top of the screen are very small, all I want is to make the images bigger when you hover the mouse over them and to have text show below showing what team the icon belongs too.

I have tried to find something on the web that shows how to do it but I dont know how to implement the code. The code I am using is below.

PHP Code:
<p align="center"><img border="0" width="41" src="http://www.freewebs.com/jonnibravo/_41739828_accrington_stanley_203.gif" height="31" style="margin: 8px; width: 41px; height: 31px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_40964115_aldershot_203.gif" height="27" style="margin: 8px; width: 36px; height: 27px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964127_barnet_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img border="0" width="33" src="http://www.freewebs.com/jonnibravo/_42481805_bournemouth_203.gif" height="25" style="margin: 8px; width: 33px; height: 25px" class="fw_image_computer fwSizeProp" /><img border="0" width="55" src="http://www.freewebs.com/jonnibravo/_42453486_bradford_203.gif" height="41" style="margin: 8px; width: 55px; height: 41px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_42484917_brentford_203.gif" height="27" style="margin: 8px; width: 36px; height: 27px" class="fw_image_computer fwSizeProp" /><img border="0" width="38" src="http://www.freewebs.com/jonnibravo/_40964197_bury_203.gif" height="28" style="margin: 8px; width: 38px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="39" src="http://www.freewebs.com/jonnibravo/_44463033_chester_203.gif" height="29" style="margin: 8px; width: 39px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964335_chesterfield_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img border="0" width="37" src="http://www.freewebs.com/jonnibravo/_40964393_dagenham_redbridge_203.gif" height="28" style="margin: 8px; width: 37px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_42362464_darlington_203x152.gif" height="26" style="margin: 8px; width: 36px; height: 26px" class="fw_image_computer fwSizeProp" /><img border="0" width="30" src="http://www.freewebs.com/jonnibravo/exeter.jpg" height="26" style="margin: 8px; width: 30px; height: 26px" class="fw_image_computer fwSizeProp" /><img border="0" width="37" src="http://www.freewebs.com/jonnibravo/_40877870_gillingham_203.gif" height="28" style="margin: 8px; width: 37px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964281_grimsby_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img class="fw_image_computer fwSizeProp" border="0" width="39" src="http://www.freewebs.com/jonnibravo/lincoln.jpg" height="29" style="margin: 8px; width: 39px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="42" src="http://www.freewebs.com/jonnibravo/_42825829_luton_203.gif" height="31" style="margin: 8px; width: 42px; height: 31px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_44532873_macclesfield_new_203x152.jpg" height="32" style="margin: 8px; width: 44px; height: 32px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="21" src="http://www.freewebs.com/jonnibravo/morcambe.jpg" height="29" style="margin: 8px; width: 21px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_41351579_notts_county2_203.gif" height="33" style="margin: 8px; width: 44px; height: 33px" class="fw_image_computer fwSizeProp" /><img border="0" width="52" src="http://www.freewebs.com/jonnibravo/_44525046_port_vale_226x170.gif" height="39" style="margin: 8px; width: 52px; height: 39px" class="fw_image_computer fwSizeProp" /><img border="0" width="48" src="http://www.freewebs.com/jonnibravo/_43007293_rochdale_203.gif" height="36" style="margin: 8px; width: 48px; height: 36px" class="fw_image_computer fwSizeProp" /><img border="0" width="43" src="http://www.freewebs.com/jonnibravo/_41740022_rotherham_203.gif" height="32" style="margin: 8px; width: 43px; height: 32px" class="fw_image_computer fwSizeProp" /><img border="0" width="31" src="http://www.freewebs.com/jonnibravo/SHREWSBURY.jpg" height="31" style="margin: 8px; width: 31px; height: 31px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_40675862_wycombe_203.gif" height="33" style="margin: 8px; width: 44px; height: 33px" class="fw_image_computer fwSizeProp" /></p> 

I need help making a scroll box with images and when you click the image it shows in the center of the screen.

I pretty much need this: http://www.satriani.com/2000/about/guitars/

I need to post images vertically spaced evenly apart. How do I make the images do that?
http://i409.photobucket.com/albums/pp174/Keevu/egg.jpg this is whats wrong theres a bunch of wasted space.

I'd like to improve the appearance of three buttons on an html page. i believe this is the code:

Code:

<input type="submit" name="purchase" value="Use Remaining Credits" style="margin:7px 0" style="padding:1px 2px 1px 2px" rel="gb_page_center[600, 635] ">
<input type="button" name="search" value="Get New Credits" onclick="window.location.href='newcredits.php';" style="margin:7px 0" style="padding:1px 2px 1px 2px">
<input type="button" name="search" value="Search Again Now" onclick="window.location.href='page.php??page=12';" style="margin:7px 0" style="padding:1px 2px 1px 2px">

How can I add more attractive buttons, which would include the text "Use Remaining Credits", etc.? can you please provide a code example, with image code?
Thanks

Hey guys,

I was wondering if anyone could help me?

I wish to produce a website which works in the following way:

The header and footer remain the same, and do not reload on page refresh. Then, links on a menu bar stimulate loading a new page, however only the content below the header changes.

An example of this, is the CushyCMS website (http://www.cushycms.com). When you click the menu links, the header doesn't reload, only the page content does.

How would I do this?

My reason for wanting this method, is because I wish to have an image slider present within the header of all of my pages, and I don't wish to have to update every page each time I wish to add an image.

Please help?

Many thanks,
Luke

Hello, I'm trying to add a similar function like "www.vinesauce.com" but I don't know how... I've programmed for 1 week only and I need some help.

My site is made with html and css and here's the link to my site, http://razestream.com

I appreciate help.

On as in pre-selected when a page loads...

I mean to say that when you make an image and want certain sections of it to link to one page and another section of it to link to another whats the code for this? I've been looking everywhere and can't find it anywhere

Hey not even sure if this can be done with html or if i need to use something else but basically i want to make the thumbnails appear where the main image is when they are clicked on instead of opening a new tab like i have it set now.

http://whatashirt.com/shirts/swearing_is_caring.html

just want stuff under the more photos to appear where the main image is when clicked on

Thanks

Hey, I need help making the bg color of an autoshape change its color by pressing a button. I'm using Microsoft FrontPage and am quite new to html. I know how to press a button and change the document background color but can not figure out how to do this but with an autoshape. Here is the code I have used to change the document background color:

HTML Code:

<div style="width: 110; height: 19; position: absolute; left: 903; top: 6">
<font size="2" face="Verdana,Arial,Helvetica,Sans Serif"> 
<input type="button" name="colr" onclick="document.bgColor='#0000FF'" style="color: #0000FF; width: 18; height: 18; border: 3px outset #0000FF; background-color: #0000FF"> 
<input type="button" name="colr" onclick="document.bgColor='#00FF00'" style="width: 18; height: 18; color: #00FF00; border: 3px outset #00FF00; background-color: #00FF00"> 
<input type="button" name="colr" onclick="document.bgColor='#FFFFFF'" style="width: 18; height: 18; color: #FFFFFF; border: 3px outset #FFFFFF; background-color: #FFFFFF"> 
<input type="button" name="colr" onclick="document.bgColor='#FFFFFF'" style="width: 18; height: 18; color: #FFFFFF; border: 3px outset #FFFFFF; background-color: #FFFFFF"> 

</div>

It says document.bgcolor= ect but I cannot figure out the name of the autoshape so am not sure, in the html I think it only says the ID of the autoshape but do not know where to go from there. Please try and help and thanks in advance.

hi there. i made a website for somebody years ago when i knew nothing about html. the code is absolutely crazily bad and i am looking to revamp it.
the site is www.englishandproudofit.co.uk

i know how to do the layout but its the buttons i am struggling with.
what is the best way to make the buttons around the outside?
i only want to use one image for all of the buttons and then have text on each button that also chnages colour on hover, pretty much how it is now but what would be the correct way to do it?
all help greatly appreciated. thank you, sam

Hey guys,

I'm trying to use submit buttons to display different websites in an iframe (or maybe I could use css?)

What I'm basically trying to do is display different SQL databases when you click different buttons. So the code in the website in the iframe will just display the database.

Thanks

Hello

Im creating a IE Mobile website, which has limited CSS capabilities ( see http://blogs.msdn.com/windowsmobile/...es/213771.aspx ) and jscript capabilities( http://msdn.microsoft.com/library/de...ects2_jrzu.asp )

I have been able to change the buttons color and my current version I have the following code that changes the page background color when a button is focused. I just want the buttons to change color when the focus is on it and when no longer focused goes back to normal, so the user knows they have moved to another button.

<HEAD><title>MySite</title>
<SCRIPT TYPE="text/javascript">
<!--
function setbg(color)
{
document.bgColor=color;
document.body.style.backgroundColor=color;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE="BUTTON" NAME="Btn1" VALUE="1"
onFocus="setbg('red')" >
<INPUT TYPE="BUTTON" NAME="Btn1" VALUE="1"
onFocus="setbg('black')" >
</BODY>
</HTML>

Any suggestion on how to change just button color upon mouseover and mouseout?

Well thanks for any help 1 can extend!