takatayuuna
5/24/2018 - 12:50 AM

斜めのグリッドを使った美しいレイアウトを簡単に実装できるスクリプト -diamond.js

<link rel="stylesheet" type="text/css" href="diamonds.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.diamonds.js"></script>




$(".diamondswrap").diamonds({
    size: 250, // Size of the squares
    gap: 1 // Pixels between squares
});
<div class="diamondswrap">
    <a href="#" class="item">Hello world</a>
    <a href="#" class="item">Hello</a>
    <a href="#" class="item">Hello</a>
    ... many more items!
</div>
https://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-diamonds.html