كيف أغير لون الخلفية عند كل تحديث للصفحة؟

محمد بوسكوري · 17 يناير 2016

هل بإمكاني إدراج كود يتيح إمكانية تغيّر لون خلفية الكوقع عند كل تحديث 'refresh' للصفحة من قبل المستخدم؟

E.Nourddine · 18 يناير 2016

باستعمال Php ، يمكن الاستعانة بهذا السكريبت:

<?php 
    $rand = array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f');
    $color = '#'.$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)];
?>

على صفحة Html:

<body style="background: <?php echo $color; ?>;">

هذا مثال آخر باستعمال Javascript:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Document</title>
</head>
<body>

</body>


<script type="text/javascript" charset="utf-8" async defer>
   function getRandomColor() {
       var letters = '0123456789ABCDEF'.split('');
       var color = '#';
       for (var i = 0; i < 6; i++ ) {
           color += letters[Math.floor(Math.random() * 16)];
       }
       return color;
   }


   if (sessionStorage.getItem("reload_count")) {
      var reloadCount = sessionStorage.getItem("reload_count");
      var reloadCount = Number(reloadCount);
      var reloadCountOld = Number(reloadCount);
      sessionStorage.setItem("reload_count", reloadCount += 1);
   } else {
      sessionStorage.setItem("reload_count", 1);
   }

   if (reloadCount > reloadCountOld) {
      var hexColor = getRandomColor();
      document.body.style.backgroundColor = hexColor;
   }
</script>
</html>

ألق نظرة على هذا الرابط: Random Hex Color

تمّ تعديل 18 يناير 2016 بواسطة E.Nourddine