Jump to content

Write different variables when button is pressed...


imbored531
 Share

Recommended Posts

So, heres my website:www.freewebs.com/pimpmytoonand right now, it reloads the whole page when you go to a different page. I want it to only reload text, since this is the only thing that changes. I just started learning Javascript today, so I'm not totally sure how to do this.So far, I've made my variables in the head tag like so:

<script type="text/javascript">var HomeRight = "Home Page, Right Box Text!"var HomeLeft = "Home Page, Left Box Text!"var PowerLevelingRight = "Power Leveling Page, Right Box Text!"var PowerLevelingLeft = "Power Leveling Page, Left Box Text!"var GoldRight = "Gold Page, Right Box Text!"var GoldLeft = "Gold Page, Left Box Text!"var HonorLevelingRight = "Honor Leveling Page, Right Box Text!"var HonorLevelingLeft = "Honor Leveling Page, Left Box Text!"var AboutUsRight = "About Us Page, Right Box Text!"var AboutUsLeft = "About Us Page, Left Box Text!"var RentAnAccountRight = "Rent An Account Page, Right Box Text!"var RentAnAccountLeft = "Rent An Account Page, Left Box Text!"var JoinUsRight = "Join Us Page, Left Box Text!"var JoinUsLeft = "Join Us Page, Right Box Text!"</script>

So, when someone presses the Home Button, for example, I want it to write var HomeRight in the Right Box on the home page, and write var HomeLeft in the left box on the home page.My buttons have rollover effects, so the code looks like this:

		<td height="1" colspan="3" rowspan="2">			<a href="Index.htm"				onmouseover="changeImages('pimpmytoon_Button', 'images/pimpmytoon_Button-over.png'); return true;"				onmouseout="changeImages('pimpmytoon_Button', 'images/pimpmytoon_Button.png'); return true;"				onmousedown="changeImages('pimpmytoon_Button', 'images/pimpmytoon_Button-over.png'); return true;"				onmouseup="changeImages('pimpmytoon_Button', 'images/pimpmytoon_Button-over.png'); return true;">				<img name="pimpmytoon_Button" src="images/pimpmytoon_Button.png" width="121" height="30" border="0" alt="Home"></a></td>

Could someone please help me out? I have no idea what do next...

Link to comment
Share on other sites

Send the page name to the function:

<img src="...." onClick="loadText('Home');" />

then use a switch to load the correct text

 <script type="text/javascript">function loadText(page) {	var HomeRight = "Home Page, Right Box Text!"	var HomeLeft = "Home Page, Left Box Text!"	var PowerLevellingRight = "Power Leveling Page, Right Box Text!"	var PowerLevellingLeft = "Power Leveling Page, Left Box Text!"	var GoldRight = "Gold Page, Right Box Text!"	var GoldLeft = "Gold Page, Left Box Text!"	var HonorLevelingRight = "Honor Leveling Page, Right Box Text!"	var HonorLevelingLeft = "Honor Leveling Page, Left Box Text!"	var AboutUsRight = "About Us Page, Right Box Text!"	var AboutUsLeft = "About Us Page, Left Box Text!"	var RentAnAccountRight = "Rent An Account Page, Right Box Text!"	var RentAnAccountLeft = "Rent An Account Page, Left Box Text!"	var JoinUsRight = "Join Us Page, Left Box Text!"	var JoinUsLeft = "Join Us Page, Right Box Text!"	var left = document.getElementById('leftbox');	var right = document.getElementById('rightbox');	switch (page) {	case 'Home':		left.innerHTML = HomeLeft;		right.innerHTML = HomeRight;		break;	case 'PowerLevelling':		left.innerHTML = PowerLevellingLeft;		right.innerHTML = PowerLevellingRight;		break;	default:		left.innerHTML = '';		right.innerHTML = '';		break;	}}</script>

- you'll need to finish off the switch, i only added 2 of them.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...