21492 Posts in 5783 Topics by 2621 members
General Questions
SilverStripe Forums » General Questions » Easy control to detect every nth list item in Silverstripe
General questions about getting started with SilverStripe that don't fit in any of the categories above.
Moderators: martimiz, Howard, Sean, Ryan M., biapar, Willr, Ingo, swaiba, simon_w
|
Page:
1
|
Go to End | |
| Author | Topic: | 436 Views |
-
Easy control to detect every nth list item in Silverstripe

3 February 2012 at 10:58pm
Thought I'd post this in case it's of use to anyone looking the apply custom styles to certain list elements.
I had a gallery page with images contained in a ul list with 10px padding on the right and bottom edges. I needed to apply a CSS style on every 5th image (at the right edge of the page) with no padding on the right edge, so it fits the page width structure.
I've used the following jQuery script on sites I've built outside of the Silverstripe framework and it works well, however I was struggling to get this to work correctly with the SS framework.
<script>
jQuery(document).ready(function() {
jQuery(".examples li:nth-child(3n)").addClass("nopadding");
});
</script>There are some $this->iteratorPos % 3 commands outlined on the forums for applying custom styles but this was by far the simplest method in 2.4… MultipleOf() : http://doc.silverstripe.org/templates
<ul>
<% if MultipleOf(4) %>
<li class="fourth">Your content here</li>
<% else %>
<li>Your content here</li>
<% end_if %>
</ul>Thanks to Socks for his post here:
http://www.silverstripe.org/template-questions/show/5357?start=16#post297212
| 436 Views | ||
|
Page:
1
|
Go to Top |

