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

  • files
  • js
  • html
<link href="<PATH>/jquery.pageslide.css" rel="stylesheet" />
<script src="<PATH>/jquery.min.js"></script>
<script src="<PATH>/jquery.pageslide.min.js"></script>
<script>
	$(window).load(function(){
		$('#PageSlideBtn01').pageslide();
		$('#PageSlideBtn02').pageslide({
			direction: 'left',
			modal: true
		});
		$('#PageSlideBtn03').on('click', function(){
			$.pageslide.close();
		});
	});
</script>
<button id="PageSlideBtn01" class="yellow PageSlide-btn" href="#PageSlideDemo01">PageSlideってみるべし</button>
<button id="PageSlideBtn02" class="blue PageSlide-btn" href="#PageSlideDemo02">さらにPageSlideってみるべし</button>

<div id="PageSlideDemo01" class="PageSlide-demo" style="display:none">
    <p class="title">デフォルト設定</p>
	<p>この設定の場合は、メインウィンドウ部のどこをクリックしてもメニューが閉じます</p>
</div>

<div id="PageSlideDemo02" class="PageSlide-demo" style="display:none">
    <p class="title">modalをtrueに設定</p>
	<p>この設定の場合は、closeボタンをクリックしないとメニューは閉じれません</p>
	<button id="PageSlideBtn03" class="red">CLOSE</button>
</div>

PageSlideについて

PageSlideは、スマホサイトでしばしば見かける、横からゴゴゴゴと出てくるサイドメニューを設置できるプラグインです。
サイドメニューをiframeで表示することも可能です。
ダウンロード こちら
ドキュメント こちら
デモ こちら
ライセンスMIT or GPL
対応ブラウザ

関連するjQueryプラグイン

  • ContextMenu2

    ContextMenu2

    右クリックのメニューをオリジナルなものに変更できる

  • MeanMenu

    MeanMenu

    レスポンシブメニューを簡単に設置できる

  • Multilevelpushmenu

    Multilevelpushmenu

    横から重なるようにメニューが出てくる

  • FlexibleSlideToTopAccordion

    FlexibleSlideToTopAccordion

    自動で頭出しをしてくれるアコーディオンメニュー

  • Tabber

    Tabber

    タブメニューを簡単に設置できる