Ajax
- It stands for Asynchronous Javascript and XML and it enables to receive requesting data from a server without scene change of the page that you are looking at. Also, we are going to know the way of retrieving external data from XML or JSON.
- In the difference between synchronous way and asynchronous, synchronous can execute next action after receiving response back from the server while asynchronous way can take next action without response from the server.
Purpose
- For exchanging information such as XML, JSON, TEXT and (X)HTML between a client and a server without scene change. In other words, Ajax enables that the client computer can receive requesting data from server without scene change.
Example
- When you write a comment on a blog or internet cafe, it is possible to do that without page change. Which is implemented by Ajax.
Methods
load() - It is used for retrieving external content
$(element).load(url, data, call back function)
ex) $("#d1").load("documnet_1.txt"); // all the content from document_1.txt and remve all the sub element of
$.ajax() -
It is possible to transmit a data through the way of HTTP, POST and GET. This is an integrated method that could request data from the type of (X)HTML, XML, JSON and TEXT.
In other words, it is considered as a mixed function with $.post(), $.get() and $.getJSON().
$.post()
- It is used for receiving a response from a server after transmitting a data to the server in the way of HTTP POST.
$.get()
- It is used for receiving response request to the server after transmitting a data to the server in the way of HTTP GET.
$.getJSON()
- It is used for receiving a response of the JSON formation from the server after transmitting a data to the server in the way of HTTP GET.
$.getScript()
- It is used for calling external javascript by using Ajax
$.ajaxStop(function(){ ... })
- Exec statement is executed in the function once response request to the server is complete in the asynchronous way.
$.ajaxSuccess(function(){ ... })
- Exec statement is executed in the function after completing ajax request successfully.
serialize()
- When the input value is transmitted by a visitor, data is transmitted to action page after converting to query string formation like 'name1=value1 & name2 = value2 ...'.
serializeArray()
- Description is same with serialize() but converting to JSON data like key1:value1, key2:value2 ...
ajaxComplete(function(){ ... })
- Exec statement is executed if Ajax communication is finished.
Tuesday, 27 October 2015
jQuery Animation
Effect Method
hide() - It hides exposed element
show() - It shows hidden element
toggle() - Hidden element is exposed and vice versa
fadeIn() - Hidden element is being gradually shown
fadeOut() - Exposed element is being gradually hidden
fadeToggle() - Exposed element is being hidden and vice versa
fadeTo() - Exposed element is hidden as much as appointed transparency
slideDown() - Hidden element is exposd by spreading at downside
slideUp() - Exposed element is hidden by folding at upside
slideToggle() - Hidden element is exposed by spreading at downside and vice versa
animate() - Apply animation to selected element
$("element").hide("effect speed", callback function);
$("element").show("effect speed", callback function);
$("element").toggle("effect speed", callback function);
$("element").fadeOut("effect speed", callback function);
$("element").fadeIn("effect speed", callback function);
$("element").fadeToggle("effect speed", callback function);
$("element").slideUp("effect speed", callback function);
$("element").slideDown("effect speed", callback function);
$("element").slideToggle("effect speed", callback function);
effect speed - fast, normal, slow, 1000 (1sec), 3000(3sec), etc
callback function - It is executed after finishing effect (can be omitted)
$("element").fadeTo("effect speed", transparency, callback function);
transparency - you can appoint specific extent of the transparency
$("element").animate({animation property}, "effect speed", callback function);
animation property - Input CSS for applying property ex) margin-left:100px;
---------------------------------------------------------------------------------------------------------
Effect Control Method
stop() - It stops all executing effect
delay() - Delay standing by effect as much as appointed amount
queue() - Return standing by a queue to the stack of the selected element or enable to add exec statement of the function to the queue
clearqueue() - Execute only effect or animation corresponding to the first queue and delete every standing by queue
dequeue() - Delete all the queue accumulated to the stack
finish() - Finish after executing animation of the selected element go to the time of completion forcefully
hide() - It hides exposed element
show() - It shows hidden element
toggle() - Hidden element is exposed and vice versa
fadeIn() - Hidden element is being gradually shown
fadeOut() - Exposed element is being gradually hidden
fadeToggle() - Exposed element is being hidden and vice versa
fadeTo() - Exposed element is hidden as much as appointed transparency
slideDown() - Hidden element is exposd by spreading at downside
slideUp() - Exposed element is hidden by folding at upside
slideToggle() - Hidden element is exposed by spreading at downside and vice versa
animate() - Apply animation to selected element
$("element").hide("effect speed", callback function);
$("element").show("effect speed", callback function);
$("element").toggle("effect speed", callback function);
$("element").fadeOut("effect speed", callback function);
$("element").fadeIn("effect speed", callback function);
$("element").fadeToggle("effect speed", callback function);
$("element").slideUp("effect speed", callback function);
$("element").slideDown("effect speed", callback function);
$("element").slideToggle("effect speed", callback function);
effect speed - fast, normal, slow, 1000 (1sec), 3000(3sec), etc
callback function - It is executed after finishing effect (can be omitted)
$("element").fadeTo("effect speed", transparency, callback function);
transparency - you can appoint specific extent of the transparency
$("element").animate({animation property}, "effect speed", callback function);
animation property - Input CSS for applying property ex) margin-left:100px;
---------------------------------------------------------------------------------------------------------
Effect Control Method
stop() - It stops all executing effect
delay() - Delay standing by effect as much as appointed amount
queue() - Return standing by a queue to the stack of the selected element or enable to add exec statement of the function to the queue
clearqueue() - Execute only effect or animation corresponding to the first queue and delete every standing by queue
dequeue() - Delete all the queue accumulated to the stack
finish() - Finish after executing animation of the selected element go to the time of completion forcefully
Thursday, 22 October 2015
jQuery Event
Loading Event
load() - occur event after loading the source related to selected image or frame elements
ready() - occur event after completing loading of the HTML document object
--------------------------------------------------------------------------------------------------------------------
Mouse Event
click() - occur event once the selected element is clicked
dblclick() - occur event once the selected element is clicked with double time
mouseout() - occur event once the mouse pointer is out of the area in the selected element
mouseover() - occur event once the mouse pointer is on the area of the selected element
hover() - occur event once the mouse pointer is on and out of the area in the selected element
mousedown() - occur event once the mouse is clicked on the area of the selected element
mouseup() - occur event once the mouse button is detached from pushing on the area of selected element
mouseenter() - occur event once mouse pointer is on the area of the selected element
mouseleave() - occur event once mouse pointer is out of the area in the selected element
mousemove() - occur event once mouse pointer is moved in the area of the selected element
--------------------------------------------------------------------------------------------------------------------
Focus Event
focus() - occur event when focus is created in selected element or making it create focus forcefully
focusin() - occur event when focus is created in selected element
focusout() - occur event when focus is moved to other element
blur() - occur event when focus is moved to other element or remove focus in the selected element forcefully
--------------------------------------------------------------------------------------------------------------------
Keyboard Event
keypress() - occur event when key is pushed on the selected element and return key code except letter key
keydown() - occur event when key is pushed on the selected element and return all the key code
keyup() - occur event when the finger is detached from keyboard
--------------------------------------------------------------------------------------------------------------------
Etc Event
scroll() - occur event when moving the scroll
change() - occur event when the value of the element in selected element is changed
error() - occur event when error happens in selected element
--------------------------------------------------------------------------------------------------------------------
Group Event
- It enables to create events more than two at once
on()
- supported from jQuery 1.7 version, it is applied created new element dynamically.
for example,
$("h1 a").on({
"mouseover focus":function(){
$(this).css("color","red");
},
"mouseout blur":function(){
$(this).css("color","yellow");
}
});
$("h2 a").on("mouseover focus", function(){
$(this).css("background-color", "yellow");
});
$(document).on("mouseout blur", "h2 a", function(){
$(this).css("background-color","aqua");
});
bind()
- similar with on() but not applied to new element created dynamically
for example,
$("h1 a").bind("mouseover focus", function(){
$(this).css("background","yellow");
});
--------------------------------------------------------------------------------------------------------------------
Event Removing Method
off()
$(element).off(); // Remove all the event registered in the element
$(element).off("event name"); // Remove only appointed event in the element
For example)
$("h1 a").off(); //All the event will be gone in the element of a
load() - occur event after loading the source related to selected image or frame elements
ready() - occur event after completing loading of the HTML document object
--------------------------------------------------------------------------------------------------------------------
Mouse Event
click() - occur event once the selected element is clicked
dblclick() - occur event once the selected element is clicked with double time
mouseout() - occur event once the mouse pointer is out of the area in the selected element
mouseover() - occur event once the mouse pointer is on the area of the selected element
hover() - occur event once the mouse pointer is on and out of the area in the selected element
mousedown() - occur event once the mouse is clicked on the area of the selected element
mouseup() - occur event once the mouse button is detached from pushing on the area of selected element
mouseenter() - occur event once mouse pointer is on the area of the selected element
mouseleave() - occur event once mouse pointer is out of the area in the selected element
mousemove() - occur event once mouse pointer is moved in the area of the selected element
--------------------------------------------------------------------------------------------------------------------
Focus Event
focus() - occur event when focus is created in selected element or making it create focus forcefully
focusin() - occur event when focus is created in selected element
focusout() - occur event when focus is moved to other element
blur() - occur event when focus is moved to other element or remove focus in the selected element forcefully
--------------------------------------------------------------------------------------------------------------------
Keyboard Event
keypress() - occur event when key is pushed on the selected element and return key code except letter key
keydown() - occur event when key is pushed on the selected element and return all the key code
keyup() - occur event when the finger is detached from keyboard
--------------------------------------------------------------------------------------------------------------------
Etc Event
scroll() - occur event when moving the scroll
change() - occur event when the value of the element in selected element is changed
error() - occur event when error happens in selected element
--------------------------------------------------------------------------------------------------------------------
Group Event
- It enables to create events more than two at once
on()
- supported from jQuery 1.7 version, it is applied created new element dynamically.
for example,
$("h1 a").on({
"mouseover focus":function(){
$(this).css("color","red");
},
"mouseout blur":function(){
$(this).css("color","yellow");
}
});
$("h2 a").on("mouseover focus", function(){
$(this).css("background-color", "yellow");
});
$(document).on("mouseout blur", "h2 a", function(){
$(this).css("background-color","aqua");
});
bind()
- similar with on() but not applied to new element created dynamically
for example,
$("h1 a").bind("mouseover focus", function(){
$(this).css("background","yellow");
});
--------------------------------------------------------------------------------------------------------------------
Event Removing Method
off()
$(element).off(); // Remove all the event registered in the element
$(element).off("event name"); // Remove only appointed event in the element
For example)
$("h1 a").off(); //All the event will be gone in the element of a
Wednesday, 21 October 2015
jQuery Basics (selector / method)
* Why do we use jQuery over JavaScript?
1) To overcome cross browsing in JavaScript.
2) To implement the effect of animation in easy and convenience.
----------------------------------------------------------------------------------------------
* Meaning - EXEC statement will be executed after loading all the document.
$(document).ready(function(){
EXEC statement here
});
$(function(){
EXEC statement here
});
----------------------------------------------------------------------------------------------
* Kinds of selector
$("*") - select all elements
$("#id name") - select the element having the id
$(".class name") - select the elements having the class
$("element name") - select the elements according with the element
$("ele1, ele2, ele3, ele4 ... eleN") - select all the elements at one go
$("element name").parent() - select a parent element of the element
$("element name").parents() - select all the parent elements of the element
$("element name sub-element") - select the sub-element of the element
$("element name > child element") - select appointed child element based on the element
$("element name").children() - select all the child elements of the element
$("element name").prev() - select a previous element of the element
$("element name").prevAll() - select all previous elements of the element
$("element name1").prevUntil("element name2") - select all the elements from element name 1 to 2
$("element name").nextAll() - select all next elements of the element
----------------------------------------------------------------------------------------------
* Chaining Technique
$(element name).css(property, value).css(property, value).css(property, value);
Like above, it could be used continuously.
----------------------------------------------------------------------------------------------
* Position selector
$("element:first") - $("li:first") - select the first element of the element.
$("element").first()
$("element:last") - $("li:last") - select the last element of the element.
$("element").last()
$("element:odd") - select all the elements corresponding position of the odd number
$("element:even") - select all the elements corresponding position of the even number
$("element:nth-child(num)") - $("li:nth-child(3)") - select only third element of the li elements
$("element:nth-child(numn")) - $("li:nth-child(3n)") - select all the elements corresponding 3 multiple
$("element:eq(index)") - $(li:eq(2)) - select the element referencing to index 2
$("element").eq(index)
$("element:gt(index)") - $("li:gt(1)") - select the all the elements referencing greater than index 1
$("element:lt(index)") - $("li:lt(1)") - select the all the elements referencing less than index 1
$("element").slice(index) - $("li").slice(2) - select the all the elements referencing from index 2
----------------------------------------------------------------------------------------------
* Property Selector
$("element[property]") - $("li[title]") - select the element having title property
$("element[property=value]") - $("li[title='list']") - select the element having title named list
$("element[property^=text]") - $("a[href^='http://']") - select the all the elements having href starting with http://
$("element[property$=text]") - $("a[href$='.com']") - select the all the elements having href ending with .com
$("element[property*=text]") - $("a[href*='helloworld']") - select the all the elements having href containing helloworld
$("element:hidden") - $("li:hidden") - select the all the elements hidden
$("element:visible") - $("li:visible") - select the all the elements showing
$(":text") - select the input elements having text type
$(":selected") - select the elements applied selected attribute
$(":checked") - select the elements applied checked attribute
----------------------------------------------------------------------------------------------
* Content selector
$("element:contains('text')") - $("li:contains('text')") - select only elements having the containing 'text'
$("element").contents() - $("p").contents() - select the most cloest sub-element of the element
$("element:has(element name)") - $("li:has('span')") - select the li element having span element
$("element").has(element name)
$("element:not(:excluding element)") - $("li:not(:first)") - select others excluding first li element
$("element").not(:excluding element)
$("li").filter(".list2") - select the li elements having class named list2
$("element").find(element name) - $("li").find("strong") - select subelement, strong of the element
$("element").closest(element name) - $("strong").closest("div") - select closest high ranking div element wrapping strong
end() - $("li").children("a").end() - select previous element, li before filtering
----------------------------------------------------------------------------------------------
* Convenient methods with selectors
is() - $("li").is(":visible") - If li element is visible, it would return true
noConflict()
- var m=$.noConflict();;
- m("h1").width(100);
get() - $("li").get(0).style.color="red"; - If get() method is used in jQuery, it is recognized as DOM selector.
each() / $.each() - Selected element is brought gradually.
- $("li").each(function(){...});
- $.each($("li"), function(){...});
map() - Create new array object by changing data in array
----------------------------------------------------------------------------------------------
* Property methods
html() - $("element").html("new element") - Change to new element
text() - $("element").text() - return text in the element
- $("element").text(new text) - change to new text
css("property") - $("element").css("color"); - return value of the property
css("property","value") - $("element").css("color","blue"); - change to new value
removeAttr("property") - $("element").removeAttr("title"); - remove the selected attribute
attr("property") - $("element").attr("href"); - return value of the property
attr("property","value") - $("element").attr("href","main.html") - change to new value
addClass("class name") - $("element").addClass("abc"); - add class named abc to the element
removeClass("class name") - $("element").removeClass("abc"); - remove class named abc from the element
toggleClass("class name") - $("element").toggleClass("abc"); - Create and remove the class to the element frequently
hasClass("class name") - $("element").hasClass("abc") - Check whether there is class named abc or not and return ture or false
prop("property") - ("element").prop("tagName") - return property of the selected tag
val() - $("element").val(); - return value of the element
val(value) - $("element").val("junmo"); - change the value to the element
----------------------------------------------------------------------------------------------
* numerical value method
height() - $("element").height(); - Return height of the element except inner padding and border
- $("element").height(100); - Change height to 100
width() - $("element").width(); - Return width of the element except inner padding and border
- $("element").width(100); - Change width to 100
innerHeight() - $("element").innerHegith(); - Return height of the element containing padding
- $("element").innerHeight(300); - Change height to 300
outerHeight() - $("element").outerHeight(); - Return height of the element containing padding and border
- $("element").outerHeight(100); - Change height to 100
position() - $("element").position().left; - Return the value of position how much far away from left
- $("element").position().top; - Return the value of position how much far away from top
offset() - $("element").offset().left; - Return the value how much far away from left in whole document
- $("element").offset().top; - Return the value how much far away from top in whole document
scrollLeft() - $(window).scrollLeft(); - Return the value of moving width
scrollTop() - $(window).scrollTop(); - Return the value of moving height
----------------------------------------------------------------------------------------------
* Object method
before() - $("element").before("new element"); - Add new element before the element
after() - $("element").after("new element"); - Add new element after the element
append() - $("element").append("new element"); - Add new element at the end position of the element
appendTo() - $("new element").appendTo("element"); - Add new element to the end of the element
insertBefore() - $("element").insertBefore("new element"); - Add new element before the element
insertAfter() - $("element").insertAfter("new element"); - Add new element after the element
clone() - $("element").clone(true or false); -If it is true, even all the sub elements are cloned together while only selected element cloned once it is false.
empty() - $("element").empty(); - Remove all the sub elements of the element
remove() - $("element").remove(); - Remove the element
replaceAll()/replaceWith() - $("new element").replaceAll("element");
- $("element").replaceWith("new element");
- Change new element from the element
unwrap() - $("element").unwrap(); - Remove parent element of the element
wrap() - $("element").wrap("new element"); - Wrap the element with new element
wrapAll() - $("element").wrapAll(); - Wrap the element with new element at once.
wrapInner() - $("element").wrapInner("new element"); - Wrap the content of the element with new element each
1) To overcome cross browsing in JavaScript.
2) To implement the effect of animation in easy and convenience.
----------------------------------------------------------------------------------------------
* Meaning - EXEC statement will be executed after loading all the document.
$(document).ready(function(){
EXEC statement here
});
$(function(){
EXEC statement here
});
----------------------------------------------------------------------------------------------
* Kinds of selector
$("*") - select all elements
$("#id name") - select the element having the id
$(".class name") - select the elements having the class
$("element name") - select the elements according with the element
$("ele1, ele2, ele3, ele4 ... eleN") - select all the elements at one go
$("element name").parent() - select a parent element of the element
$("element name").parents() - select all the parent elements of the element
$("element name sub-element") - select the sub-element of the element
$("element name > child element") - select appointed child element based on the element
$("element name").children() - select all the child elements of the element
$("element name").prev() - select a previous element of the element
$("element name").prevAll() - select all previous elements of the element
$("element name1").prevUntil("element name2") - select all the elements from element name 1 to 2
$("element name").nextAll() - select all next elements of the element
----------------------------------------------------------------------------------------------
* Chaining Technique
$(element name).css(property, value).css(property, value).css(property, value);
Like above, it could be used continuously.
----------------------------------------------------------------------------------------------
* Position selector
$("element:first") - $("li:first") - select the first element of the element.
$("element").first()
$("element:last") - $("li:last") - select the last element of the element.
$("element").last()
$("element:odd") - select all the elements corresponding position of the odd number
$("element:even") - select all the elements corresponding position of the even number
$("element:nth-child(num)") - $("li:nth-child(3)") - select only third element of the li elements
$("element:nth-child(numn")) - $("li:nth-child(3n)") - select all the elements corresponding 3 multiple
$("element:eq(index)") - $(li:eq(2)) - select the element referencing to index 2
$("element").eq(index)
$("element:gt(index)") - $("li:gt(1)") - select the all the elements referencing greater than index 1
$("element:lt(index)") - $("li:lt(1)") - select the all the elements referencing less than index 1
$("element").slice(index) - $("li").slice(2) - select the all the elements referencing from index 2
----------------------------------------------------------------------------------------------
* Property Selector
$("element[property]") - $("li[title]") - select the element having title property
$("element[property=value]") - $("li[title='list']") - select the element having title named list
$("element[property^=text]") - $("a[href^='http://']") - select the all the elements having href starting with http://
$("element[property$=text]") - $("a[href$='.com']") - select the all the elements having href ending with .com
$("element[property*=text]") - $("a[href*='helloworld']") - select the all the elements having href containing helloworld
$("element:hidden") - $("li:hidden") - select the all the elements hidden
$("element:visible") - $("li:visible") - select the all the elements showing
$(":text") - select the input elements having text type
$(":selected") - select the elements applied selected attribute
$(":checked") - select the elements applied checked attribute
----------------------------------------------------------------------------------------------
* Content selector
$("element:contains('text')") - $("li:contains('text')") - select only elements having the containing 'text'
$("element").contents() - $("p").contents() - select the most cloest sub-element of the element
$("element:has(element name)") - $("li:has('span')") - select the li element having span element
$("element").has(element name)
$("element:not(:excluding element)") - $("li:not(:first)") - select others excluding first li element
$("element").not(:excluding element)
$("li").filter(".list2") - select the li elements having class named list2
$("element").find(element name) - $("li").find("strong") - select subelement, strong of the element
$("element").closest(element name) - $("strong").closest("div") - select closest high ranking div element wrapping strong
end() - $("li").children("a").end() - select previous element, li before filtering
----------------------------------------------------------------------------------------------
* Convenient methods with selectors
is() - $("li").is(":visible") - If li element is visible, it would return true
noConflict()
- var m=$.noConflict();;
- m("h1").width(100);
get() - $("li").get(0).style.color="red"; - If get() method is used in jQuery, it is recognized as DOM selector.
each() / $.each() - Selected element is brought gradually.
- $("li").each(function(){...});
- $.each($("li"), function(){...});
map() - Create new array object by changing data in array
----------------------------------------------------------------------------------------------
* Property methods
html() - $("element").html("new element") - Change to new element
text() - $("element").text() - return text in the element
- $("element").text(new text) - change to new text
css("property") - $("element").css("color"); - return value of the property
css("property","value") - $("element").css("color","blue"); - change to new value
removeAttr("property") - $("element").removeAttr("title"); - remove the selected attribute
attr("property") - $("element").attr("href"); - return value of the property
attr("property","value") - $("element").attr("href","main.html") - change to new value
addClass("class name") - $("element").addClass("abc"); - add class named abc to the element
removeClass("class name") - $("element").removeClass("abc"); - remove class named abc from the element
toggleClass("class name") - $("element").toggleClass("abc"); - Create and remove the class to the element frequently
hasClass("class name") - $("element").hasClass("abc") - Check whether there is class named abc or not and return ture or false
prop("property") - ("element").prop("tagName") - return property of the selected tag
val() - $("element").val(); - return value of the element
val(value) - $("element").val("junmo"); - change the value to the element
----------------------------------------------------------------------------------------------
* numerical value method
height() - $("element").height(); - Return height of the element except inner padding and border
- $("element").height(100); - Change height to 100
width() - $("element").width(); - Return width of the element except inner padding and border
- $("element").width(100); - Change width to 100
innerHeight() - $("element").innerHegith(); - Return height of the element containing padding
- $("element").innerHeight(300); - Change height to 300
outerHeight() - $("element").outerHeight(); - Return height of the element containing padding and border
- $("element").outerHeight(100); - Change height to 100
position() - $("element").position().left; - Return the value of position how much far away from left
- $("element").position().top; - Return the value of position how much far away from top
offset() - $("element").offset().left; - Return the value how much far away from left in whole document
- $("element").offset().top; - Return the value how much far away from top in whole document
scrollLeft() - $(window).scrollLeft(); - Return the value of moving width
scrollTop() - $(window).scrollTop(); - Return the value of moving height
----------------------------------------------------------------------------------------------
* Object method
before() - $("element").before("new element"); - Add new element before the element
after() - $("element").after("new element"); - Add new element after the element
append() - $("element").append("new element"); - Add new element at the end position of the element
appendTo() - $("new element").appendTo("element"); - Add new element to the end of the element
insertBefore() - $("element").insertBefore("new element"); - Add new element before the element
insertAfter() - $("element").insertAfter("new element"); - Add new element after the element
clone() - $("element").clone(true or false); -If it is true, even all the sub elements are cloned together while only selected element cloned once it is false.
empty() - $("element").empty(); - Remove all the sub elements of the element
remove() - $("element").remove(); - Remove the element
replaceAll()/replaceWith() - $("new element").replaceAll("element");
- $("element").replaceWith("new element");
- Change new element from the element
unwrap() - $("element").unwrap(); - Remove parent element of the element
wrap() - $("element").wrap("new element"); - Wrap the element with new element
wrapAll() - $("element").wrapAll(); - Wrap the element with new element at once.
wrapInner() - $("element").wrapInner("new element"); - Wrap the content of the element with new element each
Thursday, 15 October 2015
Full-Screen Pop-Out Navigation
https://codyhouse.co/gem/full-screen-pop-out-navigation/
Above, it is the URL that you can get the source for the navigation
Above, it is the URL that you can get the source for the navigation
** Especially, when you open the navigation, you could not navigate below and it seems like fixed screen. -> Which is by code "overflow:hidden". It makes the rest of the part hidden except the screen that you can see.
Saturday, 10 October 2015
jQuery Basics
jQuery Basics
- ID Selector
$('#example')
- Class Selector
$('.example')
- Click Function with id selector
$('#example').click(function(){
Executing code
});
- Get id information
$('selector').attr('id');
- Control css
$('selector').css("css element", "value");
ex) $('#example').css("display","none");
Subscribe to:
Comments (Atom)