0

below is my script and when i run this script then i notice a flicker occur. specially the animation look so worse in IE specially. i know that flicker occur due to increase div size using animate function. so please guide me how can i make this below script animation looks very smooth. guide me what code i need to change in my script as a result it will function same but animation look smooth. i dont want any flicker. thanks

here is demo url http://jsfiddle.net/tridip/kPZrZ/2/

$(document).ready(function () {
        $('#lnk').click(function (e) {
            $('body').append('<div id="transition"></div>').show();

            var $t = $('#transition'),
            to = $(this).offset(),
            td = $(document);

            $t.css({
                top: to.top + 50,
                left: to.left + 50,
                display: 'block'
            }).animate({
                opacity: 1,
                top: td.height() / 2,
                left: td.width() / 2
            }, 600, function () {
                $(this).animate({
                    top: '-=75',
                    left: '-=50'
                }, 600);

                $('#transition').addClass("BusyStyles");
                setTimeout(function () {
                    $('#transition').animate({
                        top: (td.height() / 2) - 200/2,
                        left: (td.width() / 2) - 250/2,
                        width: 250,
                        height: 200
                    }, 600, function () {
                        //alert('pp');
                        // to do things   
                        $('#transition').removeClass("BusyStyles");
                        $('#transition').html('<b>Welcome...</b>');
                    });
                }, 1000);
            });

            $t.click(function (e) {
                //alert('pp');
                $(this).fadeOut('slow').remove();
            });
            return false;
        });


    });
Thomas
  • 33,544
  • 126
  • 357
  • 626
  • http://stackoverflow.com/questions/2532488/how-to-move-an-element-in-diagonal-movement-in-jquery – Thomas Sep 26 '12 at 14:01
  • https://forum.jquery.com/topic/smooth-diagonal-scrolling http://stackoverflow.com/questions/9689765/how-to-scroll-diagonally-with-jquery-or-javascript http://www.pagecolumn.com/javascript/div_move_script.htm http://www.adriantomic.se/development/jquery-localscroll-tutorial/ – Thomas Sep 26 '12 at 14:05

0 Answers0