How to create a website with jQuery

How to create a website with jQuery 1

The Best WordPress Hosting

After many years of using and jumping from hosting to hosting, we have finally found the best one, and we want to share it with you.

Many of you may be wondering what is jQuery?. jQuery is an association of javascript functions that facilitate the task of creating a web page using this language. In today's article we will explain how to use jQuery to create a professional looking website without the need for complex coding.

How to create websites with jQuery

The main use we will make of jQuery will be the pagination of the web, that is, it will allow us to create a simple menu that shows the content we want when we click on any of its links.

The code we will use is as follows:

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Transitional//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd»>

<html xmlns="»http://www.w3.org/1999/xhtml»">

<html>

<head>

<meta http-equiv=»Content-Type» content=»text/html; charset=iso-8859-1″ />

jQuery.

<script src=»http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js»></script>  //Import the jQuery library from the Google repository

<script>

$(document).ready(function(){

$("#contact").click(function(event){  //Function that displays the content of the contact.html file in the zone we mark as destination.

event.preventDefault();

$("#destination").load("contact.html");

});

$("#works").click(function(event){  //Function that displays the content of the jobs.html file in the zone we mark as destination.

event.preventDefault();

$("#destination").load("jobs.html");

});

$("#destination").load("home.html");  //Fills the content of home.html in the target zone when the web is loaded.

})

</script>

</head>

<body>

<center><a href="/en/»/#contacto»" id="»contacto»">Contact</a> | <a href="/en/»/#trabajos»">Jobs</a></center>  //Create menu

<div></div>  //Create target zone

</body>

</html>

This is the basic code that will allow us to distribute the content on our website, however, if we add to this a nice design we will get results as professional as the following:

jQuery example

You should also know that jQuery has countless functions in addition to the one described in this article. If you wish to find out more about them, you can access its official website.

Remember that you can ask any questions you may have through our forum.

4 thoughts on “Cómo crear una web con jQuery”

  1. I have a question, I want a next>>>> button to go to the next page and every time I press it I can go to the next pages with this script, can I do this?

  2. Jquery is undoubtedly an excellent language and simplifies many tasks.

    And the fact that it is already in the Google repositories makes it so much easier as it simplifies everything.

    There are also countless tutorials available.

    Greetings!

Leave a Comment

Your email address will not be published.

en_GBEnglish
Scroll to Top