Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

jQuery for beginners

27,405 views

Published on

Slides for presentation C002 | jQuery for beginners in Sumofyou Technologies

Published in: Technology
  • DOWNLOAD FULL. BOOKS INTO AVAILABLE FORMAT ......................................................................................................................... ......................................................................................................................... 1.DOWNLOAD FULL. PDF EBOOK here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... 1.DOWNLOAD FULL. EPUB Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... 1.DOWNLOAD FULL. doc Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... 1.DOWNLOAD FULL. PDF EBOOK here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... 1.DOWNLOAD FULL. EPUB Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... 1.DOWNLOAD FULL. doc Ebook here { https://tinyurl.com/y8nn3gmc } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • ★★ How Long Does She Want You to Last? ★★ A recent study proved that the average man lasts just 2-5 minutes in bed (during intercourse). The study also showed that many women need at least 7-10 minutes of intercourse to reach "The Big O" - and, worse still... 30% of women never get there during intercourse. Clearly, most men are NOT fulfilling there women's needs in bed. Now, as I've said many times - how long you can last is no guarantee of being a GREAT LOVER. But, not being able to last 20, 30 minutes or more, is definitely a sign that you're not going to "set your woman's world on fire" between the sheets. Question is: "What can you do to last longer?" Well, one of the best recommendations I can give you today is to read THIS report. In it, you'll discover a detailed guide to an Ancient Taoist Thrusting Technique that can help any man to last much longer in bed. I can vouch 100% for the technique because my husband has been using it for years :) Here's the link to the report  https://tinyurl.com/rockhardxxx
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Thanks for sharing
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Really helpful material has been provided in these slides. Thanks for sharing.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • very good ! thanks for sharing ...
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

jQuery for beginners

  1. 1. jQuery for Beginners Arulmurugan - Developer
  2. 2. What is jQuery?• Is a free , open Javascript library• Simplifies the task of creating highly responsive web pages• Works across modern browsers• Abstracts away browser-specific features, allowing you to concentrate on design
  3. 3. Introduction to Javascript HTML CSS JavaScriptmarkup language presentation language scripting language content presentation behaviour Java JavaScript
  4. 4. What is a scripting language?• Cant communicate with OS• Cant access local files• Cant directly access database• Cant access hardware• Client-side language• Works on DOM Users Computer Web Browser Web Server Web Page JavaScript Python, PHP, ASP.NET, Ruby on Rails
  5. 5. Document Object Model Document - Object
  6. 6. Document Object Model Model html head body title h1 p ul li li li
  7. 7. JavaScript vs jQuery• Example 1 - Hide an element with id "textbox“ //javascript document.getElementById(textbox).style.display = "none"; //jQuery $(#textbox).hide();• Example 2 - Create a <h1> tag with "my text“ //javascript var h1 = document.CreateElement("h1"); h1.innerHTML = "my text"; document.getElementsByTagName(body)[0].appendChild(h1); //jQuery $(body).append( $("<h1/>").html("my text") ;
  8. 8. Enable jQuery in your page• jQuery can be enabled in your page by including reference to jQuery library file <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">• Introduce a jQuery function by using the below below given function. $(document).ready(function(){ //Script goes here }); OR $(function(){ //Script goes here });
  9. 9. Basic selectors• TagName document.getElementsByTagName("tagName"); $("tagName") - $("div"), $("p"), $("div"),.....• Tag ID document.getElementById("id"); $("#id") - $("#name"), $("#address")• Tag Class document.getElementsByClassName("className"); $(".className") - $(".comment"), $(".code")• To select all elements - $("*")
  10. 10. Selectors - Combined• Syntax $("tagName.className") $("tagName.className#tagId")• Examples $("h1.mainTitle") $("h1.mainTitle#firstHeading")
  11. 11. Index filtersSyntax: Examples:• $("selector:first") • $("p:first")• $("selector:last") • $("p:last")• $("selector:odd") • $("p:odd")• $("selector:even") • $("p:even")• $("selector:eq(i)") • $("p:eq(1)")• $("selector:gt(i)") • $("p:gt(1)")• $("selector:lt(i)") • $("p:lt(1)")
  12. 12. Condition filters - Form filters• $("selector:visible") • $("selector:input")• $("selector:hidden") • $("selector:text") • $("selector:password")• $("selector:disabled")• $("selector:enabled") • $("selector:radio") • $("selector:checkbox")• $("selector:checked")• $("selector:selected") • $("selector:submit") • $("selector:reset")• $("selector:header") • $("selector:image")• $("selector:animated") • $("selector:file")• $("selector:not(selector:not • $("selector:button") )")
  13. 13. Relationship filters - Content filters• $("selector:parent") • $("selector:content(text) ")• $("selector:first-child")• $("selector:last-child") • $("selector:empty")• $("selector:only-child") • $("selector:has(selector)")• $("selector:nth-child(i)")• $("selector:nth-child(odd)")• $("selector:nth- child(even)")• $("selector:nth- child(Xn+M)")
  14. 14. Attribute filtersSyntax: Examples:• $("selector[attribute]") • $("p:[name]")• $("selector[attribute=value ]") • $("p:[name=para]")• $("selector[attribute!=value ]") • $("p:[name!=para]")• $("selector[attribute^=valu e]") • $("p:[name^=para]")• $("selector[attribute$=valu e]") • $("p:[name$=para]")• $("selector[attribute*=valu e]") • $("p:[name*=para]")
  15. 15. Retrieve, Set and Remove attributesSyntax: Examples:• $("selector").attr("name") • $("img").attr("src")• $("selector").attr("key", • $("p").attr("class", "val") "source")• $("selector").attr("key", • $("img").attr("height", fn()) calHt())• $("selector").attr(propertie • $("img").attr({ s) "src" : "/path/", "title" : "My Img" });• $("selector").removeAttr(a • $("div").removeAttr("class“ ttr) )
  16. 16. Class, HTML, Text, Value - Functions• $("selector").hasClass("className")• $("selector").addClass("className")• $("selector").removeClass("className")• $("selector").toggleClass("className")• $("selector").html()• $("selector").html("html code")• $("selector").text()• $("selector").text("text content")• $("selector").val()• $("selector").val("value")
  17. 17. TraversingSyntax: Examples:• $("selector").length • $("h1").length• $("selector").size() • $("h1").size()• $("selector").get() • var h1_list = $("h1").get()• $("selector").get(index) • var h1 = $("h1").get(2)• $("selector").find("selector") • $("select").find("• $("selector").each(function(){ option[value=india]") $(this).xxxx(); • $("selector").each(function(){ }); $(this).addClass(title); });
  18. 18. Events• bind()• unbind()• ready()• toggle()• hover()• trigger() • $("selector").bind(event, data, handler) • $("selector").unbind(event, handler)
  19. 19. Bind - Example$(function(){ $("#myButton").bind("onclick", validate); $("#myButton").click( validate);});function validate(){ if( $("#myText").val().length == 0 ) { alert("Error") } else { $("#myForm").submit(); }}
  20. 20. Animations• show()• hide()• fadeIn()• fadeOut()• slideUp()• slideDown()
  21. 21. Additional Features• jQuery UI• AJAX functionality
  22. 22. Thank youslideshare.net/arulmr arul@arulmr.com

×