桌面上的动态交换网格位置

Question

目标是使用像这样的交换/ zig-zag网格样式的索引

是否有任何方法（CSS或jquery）可以使posts元素在桌面上交换/ zigzag动态但在移动设备上显示正常？

顺便说一句，我使用了materialize css，这是我的HTML

<div class="row">
    <div class="col s12 l6">
        <div class="featured-img" style="background-image: url(/img/1.jpg);">
        </div>
    </div>
    <div class="col s12 l6 valign-wrapper">
        <h2>Post Title</h2>
        <p>Lorem ipsum...</p>
    </div>
</div>