var title = “ jQuery: The Basics and Beyond ”;
description
Transcript of var title = “ jQuery: The Basics and Beyond ”;
![Page 1: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/1.jpg)
var title = “jQuery: The Basics and Beyond”;$(this).data({
target: ‘BEGINNERS’, speaker: ’superKalo’
});
![Page 2: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/2.jpg)
Kaloyan Kosev
Web Developerat DevLabs.bg
LinkedIn/ superKalo
![Page 3: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/3.jpg)
jQuery: The Basics and Beyond
$(this).agenda({
About: ‘Why?’,Selectors: ‘Retrieving page
content’,Events: ‘The event handling
features’,Effects: ‘Creating basic animations’
});
![Page 4: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/4.jpg)
$(this).agenda({
1: ‘Cross-Browser Support’,
});
About: Why jQuery?
![Page 5: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/5.jpg)
About: Why jQuery?
$(this).agenda({
1: ‘Cross-Browser Support’,2: ‘Easy to Learn + Community
Support’,
});
![Page 6: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/6.jpg)
About: Why jQuery?
$(this).agenda({
1: ‘Cross-Browser Support’,2: ‘Easy to Learn + Community
Support’,
3: ‘Powerful DOM Selection’
});
![Page 7: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/7.jpg)
jQuery versions?
jQuery 1.xvs.
jQuery 2.x
![Page 8: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/8.jpg)
Selectors: Retrieving page content
jQuery()$()
![Page 9: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/9.jpg)
Selectors: Retrieving page content
$(“#myId”)$(“.myClass”)
![Page 10: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/10.jpg)
Selectors: Retrieving page content
$(“ ..CSS.. ”)
![Page 11: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/11.jpg)
Selectors: Retrieving page content
$( “.submenu:visible” )$( “nav > ul > li” )$( “input[type=text]” )$( “li:even” )$( “p:not(.redP)” )
![Page 12: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/12.jpg)
Selectors: Retrieving page content
Link1Link2Link3Link4Link5
![Page 13: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/13.jpg)
Selectors: Retrieving page content
$( “a[href$=pdf]” ).append(“<img
src=‘img/icon.jpg’ />”)
Link1
![Page 14: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/14.jpg)
Selectors: Retrieving page content
$( “.subMenu:visible” )$( “section:hidden” )$( “a[href^=http]” )
![Page 15: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/15.jpg)
Selectors: Retrieving page content
![Page 16: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/16.jpg)
Selectors: The event handling
features
![Page 17: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/17.jpg)
Selectors: Retrieving page content
$( “p:contains(смотан)” ).remove();
![Page 18: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/18.jpg)
Events: The event handling
features
$( “#myElement” ).on( “ … ”, function(){//Do something
});
• click, mouseover, mouseout
• blur, focus• scroll, resize
![Page 19: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/19.jpg)
Effects: Creating basic animations
$( “#myElement” ).fadeIn(); .fadeOut(); .slideUp(); .slideDown();
$( “#myElement” ).animate({ opacity: 0.2 });
![Page 20: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/20.jpg)
![Page 21: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/21.jpg)
My Contacts
LinkedIn/ superKaloFacebook/ superKaloE-mail/ [email protected]
SlideShare/ Kaloyan Kosev
![Page 22: var title = “ jQuery: The Basics and Beyond ”;](https://reader034.fdocuments.net/reader034/viewer/2022051401/56814ffc550346895dbdc366/html5/thumbnails/22.jpg)
Thanks to our Sponsors:
Diamond Sponsor:
Gold Sponsors:
Swag Sponsors: Media Partners:
Technological Partners:
Silver Sponsors:
Bronze Partners: