如何实现两个多步骤表单，每个表单使用CSS转换

Question

我正在尝试创建一个在一侧有一个表单而在另一侧有另一个表单的对象。最重要的是，每个表单都有多个步骤。

您可以在https://dl.dropboxusercontent.com/u/2986690/test/test2.html看到它的实际效果 我已经成功地为第一种形式获得了CSS转换，但是在第二种形式（当你点击“你是停车寻找者吗？”时触发），当我点击“下一步”时它不会移动到下一步。

知道我做错了吗？

Answer 1

问题是你的所有滚动函数都引用了“front”类，但第二种形式使用了“back”类。例如，这是scroll_left_4函数：

function scroll_left_4(){
    $(".front>div:eq(0)").stop().animate({"margin-left":"-375px"},220);
}

您需要为第二个表单创建等效函数，执行以下操作：

function scroll_left_4b(){
    $(".back>div:eq(0)").stop().animate({"margin-left":"-375px"},220);
}

或者更改代码，以便同时向前和向后滚动。