このプラグインの実際の動きを確認したい場合は、PCからアクセスして下さい。

  • files
  • js
  • html
<link href="<PATH>/tiltedpage-scroll.css" rel="stylesheet" />
<script src="<PATH>/jquery.min.js"></script>
<script src="<PATH>/jquery.tiltedpage-scroll.min.js"></script>
<script>
	$(window).load(function(){
		$('#TiledPageDemo').tiltedpage_scroll({
			angle: 20
		});
	});
</script>
<button id="TiltedPageBtn01" class="red">TiltedPageを見てみる</button>

<div id="TiltedPageDemo">
	<button id="TiltedPageBtn02" class="yellow">TiltedPageをやめる</button>
	<div class="TiltedPage-demo-inner">
		<section class="page1"></section>
		<section class="page2"></section>
		<section class="page3"></section>
		<section class="page4"></section>
		<section class="page5"></section>
		<section class="page6"></section>
		<section class="page7"></section>
		<section class="page8"></section>
		<section class="page9"></section>
		<section class="page10"></section>

	</div>
</div>

TiltedPageについて

TiltedPageは、3Dで奥行き感のあるスクロールを表現できるプラグインです。 画像が縦並びになっているようなページだとおもしろい効果ができるかもしれませんね。
ダウンロード こちら
ドキュメント こちら
デモ こちら
ライセンスGPL v2
対応ブラウザ

関連するjQueryプラグイン

  • slideToucher

    slideToucher

    上下左右方向へのスワイプ、スライドを実装できる

  • OverScroll

    OverScroll

    PCブラウザ上でスマホのスワイプ機能を実現できる

  • localScroll

    localScroll

    格子状に配置した要素間をダイナミックにスクロールしてくれる

  • onepageScroll

    onepageScroll

    1ページ単位でのスクロールを実装できる

  • AnimateScroll

    AnimateScroll

    よくあるページのトップにスクロールで戻る系