Geek Answers Handbook

Fill the browser window with random numbers

I would like to fill in a visible window on a web page with random numbers. The way I'm currently trying to do this involves first a long string of random numbers, and then using the following property in a div:

 #mydiv{
      font-family: "Inconsolata", monospace;
      word-break: break-all;
      font-size: 3em;
      color: #202020;
      height: 100%;
      width: 100%;
      overflow-y:hidden;
      }

https://jsfiddle.net/4ztpbnm0/1/

It works (ish) in Chrome, but it takes a very significant amount of time to resize the browser window. Is there any way to do this without a problem?

+4
source share
3 answers

Use overflow-wrap: break-wordinstead word-break: break-all.

https://jsfiddle.net/746g71wb/

word-wrapwas recently renamed to overflow-wrap, so to support other browsers you can specify both:

word-wrap: break-word;
overflow-wrap: break-word;

, Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=591793

+5

SVG ( ). "" SVG, , :

body {
  background-color: black;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='400px' width='385px'><text x='0' y='0' font-size='40px' font-family='monospace' fill='%23202020'><tspan x='0' dy='40px'>0011010101010100</tspan><tspan x='0' dy='40px'>0101001010100101</tspan><tspan x='0' dy='40px'>1010101000010001</tspan><tspan x='0' dy='40px'>0101010101000100</tspan><tspan x='0' dy='40px'>0010110101010101</tspan><tspan x='0' dy='40px'>0101000010101010</tspan><tspan x='0' dy='40px'>1010101101110101</tspan><tspan x='0' dy='40px'>1010010010010110</tspan><tspan x='0' dy='40px'>0100110101010101</tspan><tspan x='0' dy='40px'>1011100010111001</tspan></text></svg>");
}
Hide result

8- . , SVG JavaScript .

. CSS?

0

. .

bgtext = [];
for (var i = 0; i < 173; ++i) {
  bgtext.push(Math.random() < 0.5 ? '1' : '0');
}

for (var i = 0; i < 6; ++i) {
  bgtext.push(bgtext.join(''))
};

function loadbg() {

	bgtext = bgtext.join('');

  document.getElementById('background').innerHTML = bgtext;
}
loadbg();
<body>
  <div id="background">
  </div>
</body>
Hide result
-1
source

More articles:


All Articles