Bootstrap3
日本語リファレンス

広告

メソッド  Methods


ポップオーバー(popover.js)におけるメソッド。


メソッド名 説明
show ポップオーバーを表示する。
hide ポップオーバーを非表示にする。
toggle ポップオーバーが非表示の場合は、ポップオーバーを表示する。
ポップオーバーが表示されている場合は、ポップオーバーを非表示にする。
destroy ポップオーバーを非表示にし、破壊する。
サンプル

ソースコード

HTML

<p>
	<button type="button" id="sample2popover" class="btn btn-default" data-toggle="popover" title="ポップオーバーのタイトル" data-content="ポップオーバーの内容。">サンプル・ボタン</button>
</p>
<p>
	<button type="button" id="sample2popoverShow" class="btn btn-default">show</button>
	<button type="button" id="sample2popoverHide" class="btn btn-default">hide</button>
	<button type="button" id="sample2popoverToggle" class="btn btn-default">toggle</button>
	<button type="button" id="sample2popoverDestroy" class="btn btn-default">destroy</button>
</p>

JavaScript

$(function () {
	$('[data-toggle="popover"]').popover();
	$('#sample2popoverShow').click(function () {
		$('#sample2popover').popover('show');
	});
	$('#sample2popoverHide').click(function () {
		$('#sample2popover').popover('hide');
	});
	$('#sample2popoverToggle').click(function () {
		$('#sample2popover').popover('toggle');
	});
	$('#sample2popoverDestroy').click(function () {
		$('#sample2popover').popover('destroy');
	});
});

このJavaScriptコードは、jquery.min.jsを読み込んだ後に配置する必要がある。


広告
広告