ページ 11

【jQuery】slideUp,slideDownが動かない?

Posted: 2011年1月08日(土) 10:47
by Ciel
ホントに何度も質問すいません。

ここhttp://ascii.jp/elem/000/000/498/498710/index-6.htmlを参考にして、
アコーディオンパネルを作っていたのですが、どうもうまく動きません。

クリックしても、パネルが閉じたり開いたりしてくれないのです。
上記リンクにあるサンプルページのものはクリックしても動くのですが、
自分がローカルで作ったものは動きません。
javascriptはもちろん有効にしてあります。
ソースコードを貼りますので、どこがおかしいか指摘していただけると助かります。

コード:

<html lang="ja">
<head>
<title>jqueryテストページ</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-style-type" content="text/css">
<meta http-equiv="content-script-type" content="text/javascript">
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery","1");</script>
<script type="text/javascript">google.load("jqueryui","1");</script>
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css" rel="stylesheet">
<style type="text/css">
<!--
div.dragresize{
	width:100px;
	height:100px;
	background-color:blue;
}
*{
	margin:0px;
	padding:0px;
}

dl{
	width:300px;
}

dl dt{
	background-color:green;
	border:2px solid blue;
	color:black;
	cursor:pointer;
}
dl dd{
	height:100px;
	background-color:#999999;
	border:2px solid gray;
	border-top:none;
}
-->
</style>

<script type="text/javascript">
<!--
//ドラッグリサイズスクリプト
$(function(){
$("div.dragresize").draggable().resizable();
});


$(function(){
	//まず最初以外は全部閉じる
	$("dd:not(:first)").css("display","none");
	$("dl dt").click(function(){
		//クリックされた次のDD要素が隠れていたら
		if($("+dd",this).css("display")=="none"){
			//まず全部閉じる
			$("dd").slideUp("slow");
			//クリックした次のdd要素だけ表示
			$("+dd",this).slideDown("slow");
		}
	});
});
			
			
//-->
</script>

</head>
<body>
<div class="dragresize">
ドラッグテスト
</div>
<br>


<dl>
<dt>ラルクアンシエル</dt>
<dd>大阪で結成されたバンド</dd>
<dt>hyde</dt>
<dd>ラルクアンシエルのボーカリスト</dd>
<dt>ken</dt>
<dd>ラルクアンシエルのギタリスト</dd>
<dt>tetsuya</dt>
<dd>ラルクアンシエルのベーシストにしてリーダー</dd>
<dt>yukihiro</dt>
<dd>ラルクアンシエルのドラマー</dd>
</dl>

</body>
</html>

Re: 【質問】slideUp,slideDownが動かない?

Posted: 2011年1月08日(土) 12:01
by サウス
<script type="text/javascript">google.load("jquery","1.4.2");</script>

とすれば動くみたいです。

1.4.3~は仕様が変わっているみたいですね。

1.4.2: .slideDown( [ duration ], [ callback ] )

1.4.3: .slideDown( [ duration ], [ easing ], [ callback ] )

Re: 【質問】slideUp,slideDownが動かない?

Posted: 2011年1月08日(土) 12:01
by h2so5
サンプルページとの違いはjqueryのバージョンだけですね。

Re: 【質問】slideUp,slideDownが動かない?

Posted: 2011年1月08日(土) 12:28
by Ciel
>>サウスさん、h2so5さん

ありがとうございます!
バージョンが原因でしたかぁ。。
バージョン修正したら動きました!
次からはバージョンを色々変えて試してみますね。

バージョンが変わるとメソッドの仕様が変わるのはちょっと困りましたねぇ。
当分は今指定したバージョンを直接指定して使っていこうかなと思います!

ありがとうございました!