Skip to content Skip to sidebar Skip to footer

Html 5 Page Navigation

What is the preferred way to navigate between HTML5 web pages without using any server side scripting language. Would Jquery be a good choice? Consider a user logs in and lands at

Solution 1:

HTML

<nav><ahref="index.html">Index</a><ahref="contact.html">Contact</a></nav><sectionid="content"></section>

jQuery

$(function(){
  $('nav a').on('click', function(e) {
    var htmlFile = $(this).attr('href');
    e.preventDefault();
    $('#content').load(htmlFile);
  });
});

Solution 2:

for link to your different pages in HTML5 you use this code.

<a href="url to your page">link 1 </a> 
<a href="url to your page">link 1 </a> 
<a href="url to your page">link 1 </a> 

Solution 3:

I would say anchor tags are the best choice to do this because of their universal and flexible DOM use:

<ahref="www.site.com/page1.html">Page 1</a><ahref="www.site.com/page2.html">Page 2</a><ahref="www.site.com/page3.html">Page 3</a>

If users will be logging in then you will have to use a scripting language such as PHP and establish database connections with MySQL.

jQuery has a very easy to use AJAX implementation.

Solution 4:

It sounds like you're wanting to create a single page application that gets it's data from a third party service?

I would recommend Sammy.js for intercepting routes, and jQuery to do your actual ajax calling.

If you're doing a lot of dynamic content dynamic content I would also recommend Knockout.js

Solution 5:

Great for use will be:

<ahref="page1.html">Page 1</a><ahref="page2.html">Page 2</a><ahref="page3.html">Page 3</a>

It's more faster than using this:

<ahref="http://domain.com/page1.html">Page 1</a>

Of course, you'll need to have html subpages (page1...) in the same folder as your index.html.

Post a Comment for "Html 5 Page Navigation"