I want to use the modulus to apply the CSS class to the grid of images in two different conditions: / P>
status1
I want to apply the CSS class to all the medium images indicated by *. I just can not use nth-child because I do not know that there will always be 9 images in the grid. Sometimes it can be 5, sometimes 7, sometimes 8, etc. ... this variable [IMG 1] [IMG 2] [IMG 3] [IMG 4] [IMG 5 *] IMG 6] [IMG 7] [IMG 8 *] [IMG 9]
status2
I would like to re-apply a CSS class * I used nth-child for similar reasons for the images in the grid indicated by I can not add css properties through the media situation in the given class in this position as the site has a lower width, so two columns of images. [Image 1] [Img 2 *] [Image 3] [IMG 4 *]
I have done the code yet
< Code> if ($ counter% 3 == 1) {$ Situation1 = TRUE; } If ($ counter% 3 == 0) {$ condition2 = TRUE; } $ Counter ++; & Lt; Div & lt ;? Php if ($ position 1) {post_class ('condition1'); } If ($ position2) {post_class ('condition2'); } & Gt; & Lt; Img src = "" / & gt; & Lt; / Div & gt;
The modulus is the remainder of the first operand divided by another, so your case will be required :
if ($ counter% 3 === 2) {$ condition1 = TRUE; } If ($ counter% 2 === 0) {$ situation2 = TRUE; }
and you can rewrite it:
$ condition1 = ($ counter% 3 === 2); $ Position2 = ($ counter = 2 === 0);
However , you can do this in CSS using the
nth-child selector (IE9 +):
Status 1:
: nth-child (3n + 2)
Status 2:
: Nth-child (2n + 2)
No comments:
Post a Comment