DRBU Component Library

Trots 

<div class="js-trots trots">
    <div class="trots_treaders">
        <div class="trots_treads trots_treads_forwards">
            <div class="trots_inner">
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/314x398/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/356x328/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/351x317/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/313x314/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/380x301/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/388x318/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/345x359/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/349x390/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/355x386/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/375x344/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/356x353/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/381x300/4" />
            </div>
        </div>
        <div class="trots_treads trots_treads_backwards">
            <div class="trots_inner">
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/400x367/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/326x372/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/334x328/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/329x313/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/371x305/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/324x306/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/366x334/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/336x307/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/316x396/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/303x357/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/305x315/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/389x374/4" />
            </div>
        </div>
    </div>
</div>
 
<div class="js-trots trots">
	<div class="trots_treaders">
		<div class="trots_treads trots_treads_forwards">
			<div class="trots_inner">
				{% for item in items|batch(items|length / 2, '')|first %}
					<img class="trots_image" alt="" src="https://images.fastspot.com/framework/{{random(100) + 300}}x{{ random(100) + 300 }}/{{ item.image }}" />
				{% endfor %}
			</div>
		</div>
		<div class="trots_treads trots_treads_backwards">
			<div class="trots_inner">
				{% for item in items|batch(items|length / 2, '')|last %}
					<img class="trots_image" alt="" src="https://images.fastspot.com/framework/{{random(100) + 300}}x{{ random(100) + 300 }}/{{ item.image }}" />
				{% endfor %}
			</div>
		</div>
	</div>
</div>

No notes defined.