How to apply random styles to div tag

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • ilya Kraft
    New Member
    • Jan 2011
    • 134
    #1

    How to apply random styles to div tag

    Hello,

    Alright, so I came up with idea that it would be nice if I could have my <?php echoed ?> div's with different appearance.

    On my website I collect stories from database and display them in div's.

    Here is example of how I echo divs:

    Code:
    <?php $articleDisplayList .= '<div class="story"> ' . $Story . '</div>' ?>

<!doctype>
<html>
<head>

<style>

/* Some CSS HERE */

</style>

</head>
<body>

<?php echo "$articleDisplayList"; ?>

</body>
</html>
    The question is how can I randomly change style of "story" div? say to make it in different colors. For example if you visit my site http://inelmo.com you will see that all div's there have same style, but I wantthem to be different.

    I was thinking of somehow giving a random class to div say "story1" "story2" etc. and then have different styles for them in css, but I don't know how to do it.

    If you need more information please ask questions and Thank you )))
    Tags: apperance, css, php, random style, xhtml
    • Niheel
      Recognized Expert Moderator Top Contributor
      • Jul 2005
      • 2432
      #2
      In this line:
      Code:
      <?php $articleDisplayList .= '<div class="story"> ' . $Story . '</div>' ?>
      You would assign randomly a different class to the div. For example class="story1" or class="story4" or class="story4".

      You can assign the class variable into an array and use the function array_rand to get the random values.

      Or you can assign the classes using conditions, if story is about sports then class="storyspo rts" etc.

      In your
      Code:
      <style>
/* Some CSS HERE */
 
</style>
      You would create classes with different style for each type:
      Code:
      .story1{
 color: red;
 ...
}
.story2{
 color: blue;
 . . .
}
etc . .
      niheel @ bytes

        Comment

        • ilya Kraft
          New Member
          • Jan 2011
          • 134
          #3
          Hi,

          Emmm so far I managed to understand the following

          Code:
          [B]//Create array with classes name[/B]
<?php
$classes = array("story1", "story2", "story3", "story4", "story5");
[B]//Create randomizer[/B]
$rand_class = array_rand($classes, [B][U]2[/U][/B]);
//Creaate displaylist
<?php $articleDisplayList .= '<div class="' . $rand_class . '"> ' . $Story . '</div>' ?>
?>
          Will this work? I also underlined the '2' in the code, because I don't understand what that is )))

          Thank You

            Comment

            Previous template Next
            Working...