first commit 2

2026-06-11 18:47:38 +09:00
parent c768729ce6
commit 6f534e33a6
11095 changed files with 1595758 additions and 0 deletions
@@ -0,0 +1,67 @@
+/* Basic sample */
+
+body{
+	overflow:hidden;
+	background-color:#fcfcfc;
+	margin:0;
+	padding:0;
+}
+
+.flipbook-viewport{
+	overflow:hidden;
+	width:100%;
+	height:100%;
+}
+
+.flipbook-viewport .container{
+	position:absolute;
+	top:50%;
+	left:50%;
+	margin:auto;
+}
+
+.flipbook-viewport .flipbook{
+	width:922px;
+	height:600px;
+	left:-461px;
+	top:-300px;
+}
+
+.flipbook-viewport .page{
+	width:461px;
+	height:600px;
+	background-color:white;
+	background-repeat:no-repeat;
+	background-size:100% 100%;
+}
+
+.flipbook .page{
+	-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
+	-moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
+	-ms-box-shadow:0 0 20px rgba(0,0,0,0.2);
+	-o-box-shadow:0 0 20px rgba(0,0,0,0.2);
+	box-shadow:0 0 20px rgba(0,0,0,0.2);
+}
+
+.flipbook-viewport .page img{
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+	margin:0;
+}
+
+.flipbook-viewport .shadow{
+	-webkit-transition: -webkit-box-shadow 0.5s;
+	-moz-transition: -moz-box-shadow 0.5s;
+	-o-transition: -webkit-box-shadow 0.5s;
+	-ms-transition: -ms-box-shadow 0.5s;
+
+	-webkit-box-shadow:0 0 20px #ccc;
+	-moz-box-shadow:0 0 20px #ccc;
+	-o-box-shadow:0 0 20px #ccc;
+	-ms-box-shadow:0 0 20px #ccc;
+	box-shadow:0 0 20px #ccc;
+}
@@ -0,0 +1,77 @@
+<!doctype html>
+<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]-->
+<!--[if IE 7 ]>    <html lang="en" class="ie7"> <![endif]-->
+<!--[if IE 8 ]>    <html lang="en" class="ie8"> <![endif]-->
+<!--[if IE 9 ]>    <html lang="en" class="ie9"> <![endif]-->
+<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
+<head>
+<meta name="viewport" content="width = 1050, user-scalable = no" />
+<script type="text/javascript" src="../../extras/jquery.min.1.7.js"></script>
+<script type="text/javascript" src="../../extras/modernizr.2.5.3.min.js"></script>
+</head>
+<body>
+
+<div class="flipbook-viewport">
+	<div class="container">
+		<div class="flipbook">
+			<div style="background-image:url(pages/1.jpg)"></div>
+			<div style="background-image:url(pages/2.jpg)"></div>
+			<div style="background-image:url(pages/3.jpg)"></div>
+			<div style="background-image:url(pages/4.jpg)"></div>
+			<div style="background-image:url(pages/5.jpg)"></div>
+			<div style="background-image:url(pages/6.jpg)"></div>
+			<div style="background-image:url(pages/7.jpg)"></div>
+			<div style="background-image:url(pages/8.jpg)"></div>
+			<div style="background-image:url(pages/9.jpg)"></div>
+			<div style="background-image:url(pages/10.jpg)"></div>
+			<div style="background-image:url(pages/11.jpg)"></div>
+			<div style="background-image:url(pages/12.jpg)"></div>
+		</div>
+	</div>
+</div>
+
+
+<script type="text/javascript">
+
+function loadApp() {
+
+	// Create the flipbook
+
+	$('.flipbook').turn({
+			// Width
+
+			width:922,
+			
+			// Height
+
+			height:600,
+
+			// Elevation
+
+			elevation: 50,
+			
+			// Enable gradients
+
+			gradients: true,
+			
+			// Auto center this flipbook
+
+			autoCenter: true
+
+	});
+}
+
+// Load the HTML4 version if there's not CSS transform
+
+yepnope({
+	test : Modernizr.csstransforms,
+	yep: ['../../lib/turn.js'],
+	nope: ['../../lib/turn.html4.min.js'],
+	both: ['css/basic.css'],
+	complete: loadApp
+});
+
+</script>
+
+</body>
+</html>
@@ -0,0 +1,94 @@
+/*
+ * Basic sample
+*/
+
+function addPage(page, book) {
+
+	var id, pages = book.turn('pages');
+
+	// Create a new element for this page
+	var element = $('<div />', {});
+
+	// Add the page to the flipbook
+	if (book.turn('addPage', element, page)) {
+
+		// Add the initial HTML
+		// It will contain a loader indicator and a gradient
+		element.html('<div class="gradient"></div><div class="loader"></div>');
+
+		// Load the page
+		loadPage(page, element);
+	}
+
+}
+
+function loadPage(page, pageElement) {
+
+	// Create an image element
+
+	var img = $('<img />');
+
+	img.mousedown(function(e) {
+		e.preventDefault();
+	});
+
+	img.load(function() {
+		
+		// Set the size
+		$(this).css({width: '100%', height: '100%'});
+
+		// Add the image to the page after loaded
+
+		$(this).appendTo(pageElement);
+
+		// Remove the loader indicator
+		
+		pageElement.find('.loader').remove();
+	});
+
+	// Load the page
+
+	img.attr('src', 'pages/' +  page + '.jpg');
+
+}
+
+
+function loadLargePage(page, pageElement) {
+	
+	var img = $('<img />');
+
+	img.load(function() {
+
+		var prevImg = pageElement.find('img');
+		$(this).css({width: '100%', height: '100%'});
+		$(this).appendTo(pageElement);
+		prevImg.remove();
+		
+	});
+
+	// Loadnew page
+	
+	img.attr('src', 'pages/' +  page + '-large.jpg');
+}
+
+
+function loadSmallPage(page, pageElement) {
+	
+	var img = pageElement.find('img');
+
+	img.css({width: '100%', height: '100%'});
+
+	img.unbind('load');
+	// Loadnew page
+
+	img.attr('src', 'pages/' +  page + '.jpg');
+}
+
+
+
+// http://code.google.com/p/chromium/issues/detail?id=128488
+function isChrome() {
+
+	return navigator.userAgent.indexOf('Chrome')!=-1;
+
+}