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/375x396/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/322x313/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/396x373/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/368x352/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/300x383/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/387x376/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/368x332/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/321x336/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/393x342/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/396x376/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/311x338/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/312x399/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/301x334/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/308x347/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/357x394/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/364x355/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/308x337/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/329x353/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/358x337/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/345x303/4" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/388x354/1" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/398x372/2" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/369x371/3" />
                <img class="trots_image" alt="" src="https://images.fastspot.com/framework/360x319/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.