Can some on help with javascript please

ladygrey · Nov 28, 2004

Hi all
Hope someone can help me here I am having trouble trying to resize the text on the page I am making ( First attempt with javascript ) I am using an external .js.

Below is my text.js


Below is the example page I am working on

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>

</head>
<body>
<legend>Adjust font size</legend>
<form action="gotoLocation.cgi"><input type="button" value="down" onclick=
"adjust_text(-1)"> <input type="button" value="up" onclick=
"adjust_text(1)"></form>
<p>This is the body text</p>
<p id="test">This is the second body text</p>
<noscript>
<input type="submit"value="Go There!">
</noscript>
</body>
</html>

Any help is appreciated
Ladygrey

jpa7578 · Dec 1, 2004

There were syntax errors in both your HTML and JS code.
1. Missing </script> tag.
2. Missing " on the value for type attribute of <script> tag.
3. HTML comment tags around the <script> tag (you should have the "hide script from old browsers" in the .js file instead).

Here are my suggestions:

1. For the HTML page:

Code:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page title</title>
<script src="text.js" type="text/javascript"></script>
</head>
<body>
<legend>Ajusting font size</legend>
<form action="gotoLocation.cgi" method="GET">
<input type="button" value="down" onclick="adjust_text(-1)" />
<input type="button" value="up" onclick="adjust_text(1)" />
</form>
<p>This is the body text</p>
<p id="test">This is the second body text</p>
<noscript>
Please enable JavaScript support in your Web browser.
</noscript>
</body>
</html>

2. For the JavaScript file (although yours is fine):

Code:

var font_size = 14;
var MAX = 17;
var MIN = 11;
function adjust_text(num)
{
	font_size += num;
	if(font_size > MAX)
	{
		font_size = MAX;
	}
	if(font_size < MIN)
	{
		font_size = MIN;
	}
	document.getElementsByTagName("body")[0].style.fontSize = font_size + "px";
	document.getElementById("test").style.fontSize = (font_size + 3) + "px";
}
adjust_text(0);

Visit http://www.w3schools.com/ for tuts

Can some on help with javascript please

ladygrey

Guest

jpa7578

Guppy