jquery - jQueryを使用してボタンのテキストをフェードアウトするにはどうすればよいですか?

Question

テキストをフェードアウトしたい次のボタンがあります。ボタンをフェードアウトしたくありません。その中のテキストだけです。どうすればいいですか？

jQueryこれまで：

$('#name').click(function(){
    //Fade out text
   });

マークアップ:

 <button id="name" type="submit" class="btn btn-large">Next >></button>

Answer 1

Twitterのブートストラップを使用しているようです。その場合、<a>代わりに使用します<button>

このようなもの：

<a href="#" id="name" class="btn btn-large"><span id="fade">Next</span></a>

その後、スパンをフェードアウトできます：

$("#fade").fadeOut("slow")

jsfiddle: jsfiddle

Answer 2

テキストの色をボタンの色に変更することをお勧めします...

$('#name').click(function(){
   $(this).css('color', 'red');
});

テキストをフェードアウトできないため...

Answer 3

jQuery Color プラグインを使用して、元の色から「透明」への色の変化をアニメーション化できます。

HTML

<button id="submit_button">Next >></button>

CSS

#submit_button {
    color: #000;
}

Javascript

$(document).ready(function(){
    $('#submit_button').click(function(){
        $(this).animate({
            color: 'transparent'    
        },1000);
    });
});

例として jsFiddle を次に示します: http://jsfiddle.net/5p2cH/3/