Alternating CSS styles with php

These php operators can be used to increment (++) a variable and divide it (%) by number, thus achieveing alternating code.
Just remember to set your count variable to 0 outside of your loop before it starts:

<?php $count = 0; ?>

Used inside a loop, class names would be named .example-class0 and .example-class1 alternating.

<div class="example-class<?php echo ($count++%2); ?>">

Increasing the “2″ number allows you to increment in thirds or fourths or whatever you need:

<div class="example-class<?php echo ($count++%3); ?>">

Classes: class0 class1 class2 class0 class1 class2
Change number to 4, this is the result: class0 class1 class2 class3 class0 class1 class2 class3

My own variation on this code is

<div class="columns2 <?=($count++%2==1) ? 'columns2-2' : 'columns2-1' ?>">

Revisions

There are no revisions for this post.

Tags: , ,

No comments yet.

Leave a Reply