Below are some basic examples of Jquery and its feature.
How to add jQuery to your website
Installing
You can download jquery.js file form jquery.com.
OR
Recommended
libs/jquery/1.3.0/jquery.min.js“></script>
Jquery Code
Generally used script run this when the HTML is all ready. Live Demo
$(document).ready(function()
{
alert(‘Welcome to mistonline.in‘);
});
</script>
Similar as previous script. Take a look at Live Demo
$(function()
{
alert(‘Welcome to mistonline.in‘);
});
</script>
Run this when the whole page has been downloaded. Take a look at Live Demo
$(window).load(function()
{
alert(‘Loaded Whole Page including images)’);
});
</script>
jQuery Stucture
Here $ = jquery, selector is a DOM element and function execute a jquery fuction.
DOM - Document Object Model Wiki
Selectors
-> Select DOM elements eg: $(‘h1′) ,$(‘div’), $(‘li’)..
-> Select ID : $(‘#id_name’)
-> Select Class : $(‘.class_name’)
Structure $(selector).click().
$(function()
{
$(‘#button_action‘).click(function()
{
alert(‘Hey Button‘);
});
$(‘.link_action‘).click(function()
{
alert(‘Hey Link‘);
});
});
</script>
Hide and Show With Click Event
Hiding and Showing the div tag.
$(function()
{
$(‘.hide_box’).click(function()
{
$(‘#box’).hide();
});
$(‘.show_box’).click(function()
{
$(‘#box’).show();
});
});
</script>
Incoming search terms:
- yii dropdownlist onchange (34)
- slideToggle horizontal (22)
- jquery mobile protected (11)
- how to use jquery (9)
- jquery http_referer (7)
- check_browser_close js (6)
- jquery mobile disable dropdown (5)
- nestedsortable mysql (5)
- marquee nonstop (5)
- document expired firefox disable (5)
- jquery fadeshow plugin (4)
- avoid onbeforeunload on page refresh using jquery (4)
- nonstop marquee in jquery (4)
- textbox to uppercase using jquery website (4)
- jquery marquee nonstop (4)
- flipover in jquery (4)
- onkeypress jquery (4)
- jquery fadein fadeout slider control (4)
- jquery flip min js demo (4)
- window referrer function in jquery (4)
- jquery filestyle firefox (4)
- jquery autopager mysql (3)
- jquery ajax alphabetical pagination (3)
- jquery splashscreen js (3)
- slidetoggle horizontal tutorial (3)
- looking-jquery-text-auto slider (3)
- birthday wishes in jquery (3)
- jquery autopager tutorial (3)
- countdown flip clock animation jquery (3)
- jquery tango slide (3)
- refresh div onchange combobox jquery (3)
- jquery countdown milliseconds (3)
- flipCounter jquery (3)
- jquery launch chromeless window (3)
- disable print screen jquery (3)
- marquee without gap jquery (2)
- onleave page turning effect (2)
- jquery with webuijsf (2)
- onpagechange jquery mobile (2)
- jquery uppercase onchange (2)
You will also be interested in ,
- Fade in Fade out effect using simple jquery
- Disable browser back button using javascript
- Changing the image by dynamically changing the image source using javascript
- Calendar Script Using Javascript [Updated]
- Character Encoder And Decoder Using Javascript
- Load webpage dynamically from query string using simple javascript and iframe
- Javascript Countdown Script
- Beautiful Christmas countdown timer complete webpage with css download free
- Text auto slide information box using javascript.
- New Year and Christmas count down script using javascript
