google-chrome - Chrome インスペクタ コンソールの使用方法

Question

このページには、jQuery 効果のあるボタンがあります。アニメーションを高速化して、どのように見えるかを確認したいと思います。そこで、インスペクターを開いて、500速度に伴うフェード効果があることに気付きました。100これを変更して、どのように見えるかを確認したいと思います。コンソール スクリプト ウィンドウを使用してこれを行うにはどうすればよいですか? ありがとう

Answer 1

コンソールウィンドウで次のコードを実行できます。スクリプトは要素を削除して再度追加するだけで、fadeTo（）で速度を変更できます。

$(".hover").remove();
$('.otherbutton,.homebutton,.downloadbutton,.donatebutton')
   .append('<span class="hover"></span>').each(function () {
            var $span = $('> span.hover', this).css('opacity', 0);
            $(this).hover(function () {
                $span.stop().fadeTo(200, 1);
            }, function () {
        $span.stop().fadeTo(500, 0);
            });
   });

Answer 2

[要素] タブを開いて、関心のあるコードのセクションを展開すると、コードをダブルクリックして編集できます。