Magento：结帐滚动到页面顶部

Question

我们遇到了一个问题，当下一步在单页结帐中加载时，页面没有滚动到顶部。

如果一个人在计费步骤中输入了所有数据并单击继续按钮，则下一步将在页面的一半处加载。基于上一步的最后一个位置。

我希望单页结帐中的每一步都从页面顶部开始。

我目前在里面得到了这个 opcheckout.js:

gotoSection: function(section)
{
    var sectionElement = $('opc-'+section);
    sectionElement.addClassName('allow');
    this.accordion.openSection('opc-'+section);
    this.reloadProgressBlock(section);
    jQuery("html, body").delay(10).animate({scrollTop: jQuery("#opc-"+section).offset().top }, 500);
},

但是这样效果不好，因为我们使用的是固定的header。
那么我该如何解决这个问题，让它到达页面的绝对顶部？

Answer 1

已编辑

我使用的是 Magento 1.9.1.1，这是文件 skin/frontend/rwd/default/js/opcheckout_rwd.js 的内容：

/**
 * Magento
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License (AFL 3.0)
 * that is bundled with this package in the file LICENSE_AFL.txt.
 * It is also available through the world-wide-web at this URL:
 * http://opensource.org/licenses/afl-3.0.php
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@magento.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade Magento to newer
 * versions in the future. If you wish to customize Magento for your
 * needs please refer to http://www.magento.com for more information.
 *
 * @category    design
 * @package     rwd_default
 * @copyright   Copyright (c) 2006-2014 X.commerce, Inc. (http://www.magento.com)
 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */

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();
    }
}

我没有遇到你描述的问题。所以我建议你更改包并使用 rwd （这应该是自 Magento 1.9.1 以来的基础包）。您可以从这个包开始构建一个新的主题。

Magento：结帐滚动到页面顶部

Magento: Checkout scrolling to top of page

html

javascript

css

jquery

magento