كود زيادة حجم النص والتحكم فيه Font Size With Javascript

يمكن استخدام البرنامج النصي التالي للسماح للزوار لزيادة أو إنقاص حجم النص على الصفحة الخاصة بك. وهذا يمكن أن يكون مفيدا للزوار الذين لديهم صعوبة في قراءة النص الصعير الحجم ، وتتيح لهم زيادته بشكل يمكنهم مشاهدة بشكل واضح . هذا االسكربت سوف يقوم بتغيير حجم الخط من أي نص ضمن وسم (

). إذا كنت ترغب في تغيير النص ضمن الوسوم الأخرى قم بتحرير getElementsByTagName(p) The following script can be used to allow visitors to increase or decrease the size of text on your page. This can be useful for visitors who have trouble reading smaller text and allows them to increase it to something they can view more easily. This script will change the font size of any text within a paragraph (

tag). If you wish to change text within other tags edit the getElementsByTagName(p); part. In order for this code to work your page must be using pixel sized fonts (px) rather than relative sized fonts using em or %. Of course if you do use other font units the code can be easily adapted for these. If the script cannot find the font size of a paragraph it will default it to 12px. If you find this script useful then please consider making a donation to the developer

var min=8;
var max=18;
function increaseFontSize() {
 
   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {
 
      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
 
         var s = 12;
      }
      if(s!=max) {
 
         s += 1;
      }
      p[i].style.fontSize = s+"px"
 
   }
}
function decreaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {
 
      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
 
         var s = 12;
      }
      if(s!=min) {
 
         s -= 1;
      }
      p[i].style.fontSize = s+"px"
 
   }
}
		

ضمن الكود البرمجي أعلاه في الصفحة الخاصة بك (إما عن طريق وضعها داخل وسم head أو وضعها في ملف جافا اسكربت خارجي ومن ثم استدعائه . يمكنك ثم استد الكود بواسطة السطرين ادناه . Include the above code in your page (either by placing it within the head section or placing it in an external js file and importing it). You can then call the increase and decrease font size functions like below.

<a href="javascript:decreaseFontSize();">-</a> 
<a href="javascript:increaseFontSize();">+</a>