Archive for the ‘jQuery’ Category

jQuery framework

17
Sep

With Jquery UI we can do more interactive things.This jquery cycle plugin allows you to do different transition effects on the screen.Simply copy,paste and change the image location for make it work.Here is the code….
More »

16
Sep

The Accordion is a web control that allows you to provide multiple panes and display them one at a time.
The Accordion is implemented as a web control that contains AccordionPane web controls.

$(document).ready(function(){
$(".accordion p").hide();
$(".accordion h3").click(function(){
$(this).next("p").slideToggle("slow")
.siblings("p:visible").slideUp("slow");
});
});

The first line will hide all the <p> element within the <div class=”accordion”>
When the <h3> element is clicked, it will slideToggle the next <p>
More »

18
Feb

This is a simple application to convert all the First Letter of a string to Upper case using AJAX.

Here you have two files: an HTML file and a PHP file.
The HTML file contains the HTML code as well as Ajax code. The PHP file is meant for modifiying the string.
In this example the ajax function which is inbuilt in JQuery is called.
You can download JQuery from the folowing location:

http://jquery.com/

The code for HTML file is given below:


   
A simple comment form with submit validation and default messages *

The code for PHP file is given below. I have named it as check.php

<?php
echo ucwords($_POST['name']);
?>

Save the two files inside a folder in the www directory of Wamp Server. Also include the JQuery file.
Run the HTML file, give the string and see the output.

, , ,

17
Feb

jQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. It was released in January 2006 at BarCamp NYC by John Resig. Used by over 27% of the 10,000 most visited websites websites, jQuery is the most popular JavaScript library in use today

Use

jQuery usually exists as a single JavaScript file, containing all the common DOM, Event, Effects, and Ajax functions. It can be included within a web page using the following mark-up:

<script type=”text/javascript” src=”jQuery.js”></script>

Query has two styles of interaction:

via the $ function, which is a factory method for the jQuery object. These functions, often called commands, are chainable; they each return the jQuery object
via $.-prefixed functions. These are utility functions which do not work on the jQuery object per se.

For example:
$(“div.test”).add(“p.quote”).addClass(“blue”).slideDown(“slow”);

It is possible to perform browser-independent Ajax queries using $.ajax and associated methods to load and manipulate remote data.
$.ajax({
type: “POST”,
url: “some.php”,
data: “name=John&location=Boston”,
success: function(msg){
alert( “Data Saved: ” + msg );
}
});
… will request some.php from the server with parameters name=John and location=Boston and when the request is finished successfully, the success function will be called to alert the user.

12
Feb

Besides W3Schools one site with a really helpful tutorial for jQuery that any beginner can browse through easily is

the Web Designer Wall.

http://www.webdesignerwall.com/tutorials/jquery-tutorials-for-designers/

This tutorial is not just clear and to-the-point, it is also very bright and bold in presentation. It has 10 really helpful visual tutorials on jQuery in an easy to understand, user-friendly format.

Having a tough time with jQuery? This is your perfect solution!

P.S: Before you go here, make sure you have done your home work well and know your JavaScript and CSS well… Good Luck!

, , ,

14
Jan
Simple hello world jQuery script for beginners
jQuery is a JavaScript library or framework. It uses CSS-like selectors(#, >) to select a set of elements. Basic knowledge in JavaScript is required to understand and master jQuery.First of all, you need to have a copy of jQuery library. Click here to download the latest version of jQuery library. It’s free. Copy the downloaded jQuery file (ie, jquery-1.1.4.js) to your application folder. Now we can create a simple application with jQuery. Copy the following lines and paste it in your notepad and save the file in your application folder with an extension .htm or .html.
<html>
<head>
<script type="text/javascript" src="jquery-1.1.4.js">
</script>
<!-- include your downloaded jQuery file here -->
<script>
	jQuery(document).ready(function()
    {
		alert(’Hello World!’);
    }
    );
</script>
</head>
<body>
<h1>jQuery Tutorials</h1>
</body>
</html>

When you browse this file, you will get a ’Hello World’ alert window.