peace098beat/grid-a-licious.php

## grid-a-licious.php
<html>
<head>
<title>グリッドレイアウト | Grid-A-Licious</title>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="./js/jquery.grid-a-licious.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
</head>

<body class="bg-img1">
<style type="text/css">
	.item{
		/*height: 200px;*/
	}
</style>

<!-- main -->
<div id="grid-a-1">
	<?php
	$dir_name = "./img/img-suiko/";
	$img_ary = scandir($dir_name);
	$file_name=array();

	// 画像ファイル以外を配列から削除;
	foreach ($img_ary as $key => $value) {
		$path=$dir_name.$value;
		if(@getimagesize($path)){
			$file_name[] = $value;
		}
	}

	for ($i=1; $i < count($file_name); $i++) {
		# code...
		$thtml = '
		<div class="item color-w">
		<img src="./img/img-suiko/s-suiko-%1$03d.jpg">
		</div>
		';
		$html = vsprintf($thtml, $i);
		echo $html;
	}
	?>
</div>

<script>
$("#grid-a-1").gridalicious({
	gutter:0,
	// width: 160,
	animate: true
});

$('#prepend').click(function(){
	$("#example3").gridalicious('prepend', makeboxes());
});

$('#append').click(function(){
	$("#example3").gridalicious('append', makeboxes());
});
</script>
</body>
</html>
	<html>
	<head>
	<title>グリッドレイアウト \| Grid-A-Licious</title>
	<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
	<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
	<script src="./js/jquery.grid-a-licious.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
	</head>

	<body class="bg-img1">
	<style type="text/css">
	.item{
	/height: 200px;/
	}
	</style>

	<!-- main -->
	<div id="grid-a-1">
	<?php
	$dir_name = "./img/img-suiko/";
	$img_ary = scandir($dir_name);
	$file_name=array();

	// 画像ファイル以外を配列から削除;
	foreach ($img_ary as $key => $value) {
	$path=$dir_name.$value;
	if(@getimagesize($path)){
	$file_name[] = $value;
	}
	}

	for ($i=1; $i < count($file_name); $i++) {
	# code...
	$thtml = '
	<div class="item color-w">
	<img src="./img/img-suiko/s-suiko-%1$03d.jpg">
	</div>
	';
	$html = vsprintf($thtml, $i);
	echo $html;
	}
	?>
	</div>

	<script>
	$("#grid-a-1").gridalicious({
	gutter:0,
	// width: 160,
	animate: true
	});

	$('#prepend').click(function(){
	$("#example3").gridalicious('prepend', makeboxes());
	});

	$('#append').click(function(){
	$("#example3").gridalicious('append', makeboxes());
	});
	</script>
	</body>
	</html>