AJAXのお勉強

jQuery スライドアップ・ダウン＠AJAX

slideToggleにより、スライドアップ・ダウンを行います。

slideToggle(速度,ファンクション)です。
どちらも省略可能です。

速度：slow、normal、fastのどれかを指定。
ファンクション：後処理を記述できます。

以下では、ボタン押下により、divタグをslideToggleします。
後処理で別なdivタグをslideToggleします。


<html>
<head>
<title>Ajax jQuery slideToggle</title>
<script type="text/javascript" src="jquery-1.2.3.js"></script>
<script type="text/javascript">
<!--

$(function(){
    $("#btn").click(function(){
        setSlideToggle();
    });
});

function setSlideToggle() {
    $("#slideDiv").slideToggle("fast",function() {
            $("#slideDiv2").slideToggle();
        }
    );
}

// -->
</script>
</head>
<body>

<input type="button" id="btn" value="スライドアップ・ダウン"><BR>
<BR>
<div id="slideDiv" style="border:1px solid #CCCCCC;width:400px">
<BR>
ボタン押下で、スライドアップ・ダウンを行います。<BR>
<BR>
</div>
<div id="slideDiv2" style="border:1px solid #CCCCCC;width:400px">
<BR>
後処理<BR>
<BR>
</div>

</body>
</html>

Copyright (C) 2008 AJAXのお勉強. All Rights Reserved.