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?
Add a comment
|
1 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();
}
}
answered Jul 20, 2015 at 12:00
-
Thank you Meenakshi - where do I put this code into? Thanks! ;-)– AllysinCommented Jul 20, 2015 at 12:56
-
Create a new js file and add that to checkout/onepage page. Commented Jul 20, 2015 at 13:02
-
Check this github.com/rmsundar1/magento-mirror/blob/magento-1.9/app/design/… Commented Jul 20, 2015 at 13:12
-
I'm so sorry to be so dumb - I would create a something.js file where I put this code into, right? How do I reference that in the checkout then? thank you thank you thank you– AllysinCommented Jul 20, 2015 at 13:13
-
Check my pervious comment you have to add this js file in template/checkout/onepage.phtml Commented Jul 20, 2015 at 13:24