How to use Chrome inspector console

Question

on this page there is a button with a jQuery effect. I want to speed up the animation and see how it will look like. So I opened up the inspector and notices there is a fade effect with 500 speed. I want to chagne this to 100 and see what it'll look like. How can I do this using the consoles script window? Thanks

Answer 1

You can run the following code in your console window, the script just remove the element and add it again you can change the speed in 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

If you open the elements tab and expand the section of code you are interested in you can double click the code to edit it.