Home/ Questions/Q 7802447
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T01:16:10+00:00

Hi can anyone tell me how to make this javascript code show full screen

  • 0

Hi can anyone tell me how to make this javascript code show full screen on browsers? The code is working well but looks too small on larger devices…not sure what to change, thanks for any and all help 🙂

     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title></title>
        <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
        <meta content="width=device-width; initial-scale=1.0; maximum-scale=2.0; user-scalable=1;" name="viewport" />
        <style type="text/css">
html{background-color:transparent;height:100%;width:100%;}
    body{background-color:transparent;font-size:15pt;font-family:helvetica;color:white;}
    img{border:0px;}        </style>
    </head>
    <body>
        <!-- MAGIC 8 BALL START --><script>
var t0;
var ar8Ball = new Array;
ar8Ball[0]="Lookin' Good,<br> Right On!";
ar8Ball[1]="Sock It To Me, <br> Ask Again";
ar8Ball[2]="Hey Joe,<br>I Doubt It";
ar8Ball[3]="Outlook Along The Watchtower Not So Good";
ar8Ball[4]="Yeah Man!";
ar8Ball[5]="Outta Sight!";
ar8Ball[6]="Nope,<br> Peace Out";
ar8Ball[7]="Mellow Out,<br>Tell You Later";
ar8Ball[8]="My Foxy Ladies <br> Say No";
ar8Ball[9]="Don't Count On It,<br> Sucka";
ar8Ball[10]="I Can Dig It";
ar8Ball[11]="No Doubt <br>Brothas & Sistas";
ar8Ball[12]="Yes,<br> Can You Dig It?";
ar8Ball[13]="Righteous!";
ar8Ball[14]="Far Out!";
ar8Ball[15]="Excuse Me While I Kiss The Sky,<br> Ask Later";
ar8Ball[16]="Groovy Baby, <br> Yes";
ar8Ball[17]="Reply Purple Hazy, <br> Try Again";
ar8Ball[18]="Most Likely, <br> My Voodoo Child";
ar8Ball[19]="You Have To Go On <br> And Be Crazy";


function randomize(lo,hi)
{ return (lo + Math.floor(Math.random()*((1+hi)-lo)));
} 

function ksa8Ball()
{
  self.clearTimeout(t0);
  o = document.getElementById('theBall');
  v = '<div id=theBall style=">';
  v = v + ' width: 250px; height:380px;';
  v = v + '">';
  v = v + '<a href="javascript:ask8Ball();">';
  v = v + '<img border=0 src="jimiask1.jpg">';
  v = v + '</a>';
  v = v + '</div>';
  o.innerHTML = v;   
}

function ask8Ball()
{
  o = document.getElementById('theBall');
  v = '<div id=theBall style="';
  v = v + ' width: 250px; height:380px;';
  v = v + ' background-repeat: no-repeat;';
  v = v + ' background-image:url(jimianswer1.jpg);';
  v = v + ' text-align: center;';
  v = v + ' font-family: Arial;';
  v = v + ' font-size: 18pt;';
  v = v + ' color: #000000;';
  v = v + '"><br><br>';
  v = v + ar8Ball[randomize(0,19)];
  v = v + '</div>';
  o.innerHTML = v;
  t0 = self.setTimeout('ksa8Ball()',1 * 2500);
}
</script>
        <div style="
background-color: #000000;">
            <center>
                Just think of your question and click on Jimi
                <div id="theBall" style="width:250px; height:380px;">
                    <a href="#" onclick="ask8Ball();"><img border="0" src="jimiask1.jpg" /></a></div>
                <!-- MAGIC 8 BALL STOP --></center>
            <a href="#" onclick="ask8Ball();"> </a></div>
        <p>
            <a href="#" onclick="ask8Ball();"> </a></p>
        <p>
            <a href="#" onclick="ask8Ball();">&nbsp;</a></p>
        <p>
            <a href="#" onclick="ask8Ball();"> </a><a href="#" onclick="ask8Ball();"> </a></p>
    </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I expect your main difficulty is with this line:

    <div id="theBall" style="width:250px; height:380px;">

    You have hardcoded the size.

    So, if you want to make it adaptable, so you can change fonts and all due to size, then a stylesheet may be your best bet.

    If you want to get the browser window size you can look at this:

    http://www.java-samples.com/showtutorial.php?tutorialid=1015

    Then, if you know that then you can dynamically add the css tag for the appropriate device size (small/large).

    Then, in the css set the fonts, the div width/height, and whatever else you want to change.

    • 0