Abdul Abdul - 6 months ago 39
CSS Question

sliding through html pages next and previous buttons

I am creating multi page form on 4 different pages. I want to include a next and previous button to be able to navigate through the form. I have searched online but what i find is usually navigating

<div>
s on a page. How do I change this to do my bidding? Thank you in advance.

this is the code for the previous button i found online.
.registration-form
is the name of a form. I want to change this to navigate through my
html
pages.

$('.registration-form .btn-previous').on('click', function() {
$(this).parents('fieldset').fadeOut(400, function() {
$(this).prev().fadeIn();
});
});


Forms on the different pages have names
part1
,
part2
,
part3
and
part4
.
Also when a user goes to a previous page and goes back the next page, the user should see what he/she entered before pressing the previous button.

Answer

A static solution for you is that you can set next previous button to every page and set the respective links on that pages

for eg.

page1.html

<input type="button" value="Previous" onclick="window.location='page4.html'">
<input type="button" value="Next" onclick="window.location='page2.html'">

page2.html

<input type="button" value="Previous" onclick="window.location='page1.html'">
<input type="button" value="Next" onclick="window.location='page3.html'">

page3.html

<input type="button" value="Previous" onclick="window.location='page2.html'">
<input type="button" value="Next" onclick="window.location='page4.html'">

page4.html

<input type="button" value="Previous" onclick="window.location='page3.html'">
<input type="button" value="Next" onclick="window.location='page1.html'">
Comments