AJAXのお勉強

jQuery フェードイン・アウト@AJAX

fadeIn、fadeOutにより、フェードイン・アウトを行います。

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

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

以下では、ボタン押下により、divタグをfadeOutします。
後処理で再度divタグをfadeInします。


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

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

function setFade() {
    $("#slideDiv").fadeOut("slow",function() {
            $("#slideDiv").fadeIn("slow");
        }
    );
}

// -->
</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>

</body>
</html>

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