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/400x378/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/368x318/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/323x383/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/322x327/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/374x332/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/367x348/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/337x380/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/320x301/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/308x390/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/307x377/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/332x382/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/388x322/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/371x382/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/354x336/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/341x341/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/330x388/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/315x372/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/360x312/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/300x341/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/378x349/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/384x312/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/391x379/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/343x322/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/352x339/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.