السلام عليكم
فكرة الكود التالي هي تغيير لون الفقرات أثناء قراءتك للنقاشات الطويلة، حيث ستأخذ تدرجات الرمادي بدءًا من الأسود وانتهاءً بالأبيض
يحوي الكود بعض الرياضيات التي سيتم شرحها
خطوات العمل:
1- الإمساك بجميع النصوص الموسومة بـوسم الفقرات p
var p=document.querySelectorAll("p")
2- عدد الفقرات هو p.length، ونريد أن يكون لون الفقرة الأخيرة 255 (أبيض) والاولى سوداء، لذلك سنوجد المقدار x
var x=255/p.length
ويكون لون الفقرة هو i*x حيث i رقم الفقرة
3-نمر على جميع الفقرات، بحلقة for
for(var i=0;i<p.length;i++)
{
4-نوجد قيمة اللون الموافق للفقرة i وسيمثل b لون الخلفية وc لون النص
var b=Math.floor(x*i)
var c=Math.floor(255-x*i)
5- نقوم بإسناد الألوان إلى كلّ من الخلفية والنص
p[i].style["background-color"]="rgb("+b+","+b+","+b+")"
p[i].style["color"]="rgb("+c+","+c+","+c+")"
وتنتهي هنا حلقة for
}
والله ولي التوفيق
وعليكم السلام، هذه فكرة الكود: تغيير لون الفقرات أثناء القراءة بتدرجات الرمادي. الخطوات:
احصل على جميع الفقرات:
javascript
var p = document.querySelectorAll("p");
حساب المقدار x:
javascript
var x = 255 / p.length;
تغيير لون الفقرات باستخدام حلقة:
javascript
for (var i = 0; i < p.length; i++) {
var grayValue = Math.floor(i * x);
p[i].style.color = "rgb(" + grayValue + "," + grayValue + "," + grayValue + ")";
}
بهذا الكود، ستتغير ألوان الفقرات من الأسود إلى الأبيض بتدرجات الرمادي.
التعليقات