クリックイベントで要素の表示を切り替え
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
[[jQueryめも]]
最初は非表示で、ボタンクリックで表示・非表示を切り替えま...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4....
<script>
$(function(){
$('#button').on('click', function() {
if ($('#detail').css('display') == 'none') {
$('#detail').slideDown();
$('#button').text('非表示');
} else {
$('#detail').slideUp();
$('#button').text('表示');
}
});
});
</script>
<style>
#detail {
display: none;
}
</style>
<button type="button" id="button">表示</button>
<div id="detail">
詳細内容
</div>
終了行:
[[jQueryめも]]
最初は非表示で、ボタンクリックで表示・非表示を切り替えま...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4....
<script>
$(function(){
$('#button').on('click', function() {
if ($('#detail').css('display') == 'none') {
$('#detail').slideDown();
$('#button').text('非表示');
} else {
$('#detail').slideUp();
$('#button').text('表示');
}
});
});
</script>
<style>
#detail {
display: none;
}
</style>
<button type="button" id="button">表示</button>
<div id="detail">
詳細内容
</div>
ページ名: