JS is a method of dynamically changing the text size of web pages in real time according to the size of the browser window

  • 2021-01-11 01:50:19
  • OfStack

This article illustrates JS's method of dynamically changing the text size of a Web page based on the browser window size in real time. To share with you for your reference, as follows:

Currently, rem, with css3, has brought unprecedented changes to our mobile development, making our development easier and more compatible with many devices, but this is not the focus of this article, this article focuses on how to use js to change the size of text in real time.

The code is as follows:


<script>
 /*  Width placeholder  rem algorithm ,  According to the root the rem To calculate the relative values of the elements rem,  The default html 320/20 = 16px */
 function placeholderPic(){
  var w = document.documentElement.offsetWidth;
  document.documentElement.style.fontSize=w/20+'px';
 }
 placeholderPic();
 window.onresize=function(){
  placeholderPic();
 }
</script>

PS: Here is a very useful JavaScript compression, formatting and encryption tools, features are very powerful:

JavaScript compression/formatting/encryption tools: http: / / tools ofstack. com/code/jscompress

The above js tool encryption function can achieve js code eval function encryption form, this site also provides the following for the eval function encryption decryption tool, very powerful and practical!

js eval method online encryption decryption tool: http: / / tools ofstack. com/password/evalencode

More about JavaScript related content interested readers can view the site topic: "JavaScript search algorithm skills summary", "JavaScript animation effects and skills summary", "JavaScript error and debugging skills summary", "JavaScript data structure and algorithm skills summary", "JavaScript eraser calculation method and skills summary" and "JavaScript mathematical operation usage summary"

I hope this article is helpful to JavaScript program design.


Related articles: