Menu
For a JavaScript assignment, I am to create an new window using window.open(). This window is to be filled with content using document.write(). The window must have buttons which use JavaScript to alter the size of the text in the window.
My question is, how can I use or write JavaScript into this new window, so that I can resize the window's text?
Here is a shortened version of my code (stored in external js file):
var newWindow;
function displayWindow() {
newWindow = window.open("", "newWindow", "width=800, height=600");
newWindow.document.write('<button onclick="resizeText(1)">-</button> Text size <button onclick="resizeText(2)">+</button>');
newWindow.document.write('Here is some text that I would like to be able to be resized.');
}
function resizeText(change) {
switch (change) {
case 1:
newWindow.document.style.fontsize = "80%";
break;
case 2:
newWindow.document.style.fontsize = "120%";
break;
default:
alert('Error');
break;
}
}How can I access my JavaScript functions within document.write()? I have also tried writing functions within the document.write() statements, but that does not work either.
Thank you, Mark.
234
asked Dec 13 '25 12:12
This code works based on what you have already:
<!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>Untitled Document</title>
<script language="JavaScript" type="text/javascript">
var newWindow;
function displayWindow() {
newWindow = window.open("", "newWindow", "width=800, height=600");
var windowInsertVar = '';
windowInsertVar += '\x3Cscript>';
windowInsertVar += 'function resizeText(change) {';
windowInsertVar += 'switch (change) {';
windowInsertVar += 'case 1:';
windowInsertVar += 'document.getElementById(\'textToBeResized\').style.fontSize = "80%"\;';
windowInsertVar += 'break\;';
windowInsertVar += 'case 2:';
windowInsertVar += 'document.getElementById(\'textToBeResized\').style.fontSize = "120%"\;';
windowInsertVar += 'break\;';
windowInsertVar += 'default:';
windowInsertVar += 'alert(\'Error\')\;';
windowInsertVar += 'break\;';
windowInsertVar += '}';
windowInsertVar += '}';
windowInsertVar += '\x3C/script>';
windowInsertVar += '<button onclick="resizeText(1)">-</button> Text size <button onclick="resizeText(2)">+</button>)\;';
windowInsertVar += '<div id="textToBeResized">Here is some text that I would like to be able to be resized.</div>';
newWindow.document.write(windowInsertVar);
}
</script>
</head>
<body>
<button id="displayWindow" onClick="displayWindow();">Display Window</button>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With