投稿

12月, 2009の投稿を表示しています

JQueryで折りたたみ

前回の記事でソースを示すのに折りたたみボックスをJQueryを使って作ってみました。ただ単にJavaScriptで作っても良かったのですが、なんとなく気分で。

実際に動かすとこんな感じになります。
(※ サンプルはWordpressからBloggerに移った関係で消滅しました)

JavaScriptコード$(document).ready(function() { $("intput.oritatami").hover(function(){ $(this).css("cursor","pointer"); },function(){ $(this).css("cursor","default"); }); $("p.oritatamiC").css("display","none"); $("input.oritatami").click(function(){ $(this).next().slideToggle("fast"); var text = $(this).attr("value"); if(text.indexOf("表示") > 0) text = text.replace("表示","隠す"); else text = text.replace("隠す","表示"); $(this).attr("value",text); //$(this).next().css("display","block"); }); });HTMLコード<inputclass="oritatami"type="button"value="中身を表示"/><pclass="oritatamiC"style="display:none">中身中身中身 中身中身中身 中身…