jQuery
【jQuery】ウォールギャラリを作成し、ランダムにアイテムをスワップするアニメーションを作成SwappingWall
March 23, 2017

SwappingWall.jqueryはウォールギャラリを作成し、ランダムにアイテムをスワップするアニメーションを作成します。jQuery2.2.1以上が必要です。
divを作成
// HTML <div class="list"> <img src="img/img1.jpg"> <img src="img/img2.jpg"> <img src="img/img3.jpg"> <img src="img/img4.jpg"> <img src="img/img5.jpg"> <img src="img/img6.jpg"> <img src="img/img7.jpg"> <img src="img/img8.jpg"> </div>
// CSS .list{ width: 100%; padding: 0; margin: 0; } .list img{ float: left; }
// JS $('.list').SwappingWall({ 'time': 2000, 'itemsInRow': 4, 'duration': 400, 'responsive': [ { 'breakpoint': 991, 'itemsInRow': 3, }, { 'breakpoint': 768, 'itemsInRow': 2, } ] })
itemsInRow
time
duration
responsive
breakpoint
stop