Magento – After clicking on CONTINUE on step 3 (SHIPPING METHOD) it loads the BOTTOM of step 4 (PAYMENT INFORMATION) –) cannot see the payment options

checkout

After customers click on CONTINUE on step 3 (SHIPPING METHOD) it loads the BOTTOM of step 4 (PAYMENT INFORMATION) – you cannot see the payment options at all! You have to scroll up to see them! This is a real problem because many customers are not able to figure out they have to scroll up…How can I correct this?

Best Answer

I don't know the root cause for this. But in magento RWD theme they have fixed this issue by scroll to top by jquery.

Checkout.prototype.gotoSection = function (section, reloadProgressBlock) {

    // Adds class so that the page can be styled to only show the "Checkout Method" step

    if ((this.currentStep == 'login' || this.currentStep == 'billing') && section == 'billing') {

        $j('body').addClass('opc-has-progressed-from-login');

    }


    if (reloadProgressBlock) {

        this.reloadProgressBlock(this.currentStep);

    }

    this.currentStep = section;

    var sectionElement = $('opc-' + section);

    sectionElement.addClassName('allow');

    this.accordion.openSection('opc-' + section);


    // Scroll viewport to top of checkout steps for smaller viewports

    if (Modernizr.mq('(max-width: ' + bp.xsmall + 'px)')) {

        $j('html,body').animate({scrollTop: $j('#checkoutSteps').offset().top}, 800);

    }


    if (!reloadProgressBlock) {

        this.resetPreviousSteps();

    }

}

Check this file

Related Topic