title: Making Flexslider Responsive Based on Varying Image Sizes
body: <p>I am using the jQuery Flexslider plugin in order to display a little over 100 images. I have gotten them all to display using a foreach loop in php as seen below:</p>
  
  <pre><code>&lt;?php foreach (glob('images/glob/*') as $filename): ?&gt;
     &lt;li&gt; &lt;img src="&lt;?= $filename ?&gt;"/&gt; &lt;/li&gt; 
  &lt;?php endforeach; ?&gt;
  </code></pre>
  
  <p>My images all have the same height in 600px, but their widths are varying. Some are portrait images while others are landscape. I'm wondering if there is a way in php that I can add classes to style the two accordingly based on their widths. </p>
  
  <p>For example: </p>
  
  <pre><code>if 
     ( $img width &gt; $img height ).addClass (landscape)
  else
     ( $img height &gt; $img width ).addClass (portrait)
  </code></pre>
  
  <p>Obviously that statement above won't work but can someone please show me how to add that into my foreach statement so I can add classes to the varying images? </p>