SlideShare a Scribd company logo
1 of 73
 
What is jQuery ,[object Object],[object Object],[object Object]
Why jQuery? ,[object Object],[object Object],[object Object],[object Object]
Why jQuery? ,[object Object],[object Object],[object Object],[object Object],Great Community   Plugins Tutorials   TestCoverage Open (free) license   Books
A ajax and DOM manipulation example ,[object Object],[object Object]
It’s just a single line in jQuery $(“#content”).load(“page.html #content”);
Who’s using jQuery? http:// docs.jquery.com/Sites_Using_jQuery
Dominating the world ,[object Object],[object Object]
Let’s Start ,[object Object],[object Object]
Embed in you page ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Embed in you page ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
$(“div”). addClass(“xyz”); Find Some Elements Do something with them { } jQuery Object jQuery philosophy
A Basic Example <body>  <div> <p>I m a paragraph 1</p>  <p>I m a paragraph 2</p>  </div> <p>I m another paragraph</p>  </body>
A Basic Example <body>  <div> <p>I m a paragraph 1</p>  <p>I m a paragraph 2</p>  </div> <p>I m another paragraph</p>  </body>  Select all paragraphs.  $(“p”)
A Basic Example <body>  <div> <p class=“red”>I m a paragraph -1</p>  <p class=“red”>I m a paragraph -2</p>  </div> <p class=“red”>I m another paragraph</p>  </body>  Select all paragraphs. Add a class to them. $(“p”).addClass(“red”);
Selector Basics ,[object Object],[object Object],[object Object]
Selector Basics ,[object Object],#header{ margin : 0 auto; } div{ margin : 0px; padding : 0px } ul.menu li{ … .. }
Selector Basics ,[object Object],#header { margin : 0 auto; } div { margin : 0px; padding : 0px } ul.menu li { … .. }
Selector Basics ,[object Object],[object Object],Selecting using selectors
Selector Basics ,[object Object],[object Object],[object Object],[object Object],Selecting using selectors
Selector Basics ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Selecting using selectors
Selector Basics ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Selecting using selectors
Basic Selector Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Basic Selector Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Basic Selector Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Basic Selector Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Using filters for selecting ,[object Object],[object Object]
Basic Filters Example Student list table. Lets make it zebra. Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 Mizan XII 5 Karim VI 2 Satisfactory
Basic Filters Example $(“#students tr:even”).css(“background-color”, “#dde”) Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 Mizan XII 5 Karim VI 2 Satisfactory
Using filters for selecting ,[object Object],[object Object],[object Object],[object Object]
Content Filters Example $(“#students tr:even”).css(“background-color”, “#dde”); $(“#students td.comment:empty”).text(“No Comment”); Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 No Comment Mizan XII 5 No Comment Karim VI 2 Satisfactory
Using filters for selecting ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Attribute Filters Example $(“#students tr:even”).css(“background-color”, “#dde”); $(“#students td.comment:empty”).text(“No Comment”); $(“#students td[align=‘center']&quot;).addClass(“ocean”); Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 No Comment Mizan XII 5 No Comment Karim VI 2 Satisfactory
Using filters for selecting ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Forms Selector Example $(&quot;:submit&quot;) .click(function(e){ … }); $(&quot;input:disabled&quot;) .val(“You cannot change me&quot;); $(“#form-id input:checked”) .addClass(“selected”);
Now we can Select Let’s perform some  action
jQuery Methods ,[object Object],[object Object]
Dom Manipulation Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Dom Manipulation Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Dom Manipulation Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
jQuery Methods ,[object Object],[object Object],[object Object],[object Object]
Attributes Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
More Attributes Example ,[object Object],[object Object],[object Object],[object Object]
More Attributes Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
jQuery Methods ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Event Example ,[object Object],[object Object],[object Object],[object Object]
Event Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Event Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
jQuery Methods ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Effects Example ,[object Object],[object Object],[object Object],[object Object]
Effects Example ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
jQuery Methods ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Ajax Examples ,[object Object],[object Object],[object Object]
Ajax Examples ,[object Object],[object Object],[object Object],[object Object]
Ajax Examples ,[object Object],[object Object],[object Object],[object Object],[object Object]
Ajax Examples ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Chaining Methods ,[object Object],[object Object]
Chaining Methods ,[object Object],[object Object],[object Object],[object Object]
Chaining Methods ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],This method will return string
jQuery Plugins jQuery is extensible.
jQuery Plugins ,[object Object],[object Object]
jQuery Plugins ,[object Object],[object Object],[object Object]
And thousands of more… http://plugins.jquery.com/
jQuery UI ,[object Object]
jQuery UI – Interactions  (Draggale, Droppable, Resizable, Selectable, Sortable)
jQuery UI – Sortable Example ,[object Object]
jQuery UI – Widgets (Accordion, Datepicker, Dialog, Progressbar, Slider, Tabs)
jQuery UI – Datepicker Example $(&quot;#date&quot;).datepicker();
Which one will match your site?
Designing a jQuery UI theme - Themeroller http://ui.jquery.com/themeroller
Anis uddin Ahmad Sr. Software Engineer Right Brain Solution Ltd. http://ajaxray.com
Questions?
THANK YOU

More Related Content

What's hot

Learning jQuery in 30 minutes
Learning jQuery in 30 minutesLearning jQuery in 30 minutes
Learning jQuery in 30 minutesSimon Willison
 
Introduction to PHP Lecture 1
Introduction to PHP Lecture 1Introduction to PHP Lecture 1
Introduction to PHP Lecture 1Ajay Khatri
 
Your code sucks, let's fix it - PHP Master Series 2012
Your code sucks, let's fix it - PHP Master Series 2012Your code sucks, let's fix it - PHP Master Series 2012
Your code sucks, let's fix it - PHP Master Series 2012Rafael Dohms
 
Basics of Java Script (JS)
Basics of Java Script (JS)Basics of Java Script (JS)
Basics of Java Script (JS)Ajay Khatri
 
Your code sucks, let's fix it (CakeFest2012)
Your code sucks, let's fix it (CakeFest2012)Your code sucks, let's fix it (CakeFest2012)
Your code sucks, let's fix it (CakeFest2012)Rafael Dohms
 
Your code sucks, let's fix it - DPC UnCon
Your code sucks, let's fix it - DPC UnConYour code sucks, let's fix it - DPC UnCon
Your code sucks, let's fix it - DPC UnConRafael Dohms
 
Disregard Inputs, Acquire Zend_Form
Disregard Inputs, Acquire Zend_FormDisregard Inputs, Acquire Zend_Form
Disregard Inputs, Acquire Zend_FormDaniel Cousineau
 
Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101Ted Kulp
 
Система рендеринга в Magento
Система рендеринга в MagentoСистема рендеринга в Magento
Система рендеринга в MagentoMagecom Ukraine
 
Open Source Search: An Analysis
Open Source Search: An AnalysisOpen Source Search: An Analysis
Open Source Search: An AnalysisJustin Finkelstein
 
Introduzione JQuery
Introduzione JQueryIntroduzione JQuery
Introduzione JQueryorestJump
 

What's hot (20)

Learning jQuery in 30 minutes
Learning jQuery in 30 minutesLearning jQuery in 30 minutes
Learning jQuery in 30 minutes
 
Introduction to PHP Lecture 1
Introduction to PHP Lecture 1Introduction to PHP Lecture 1
Introduction to PHP Lecture 1
 
Your code sucks, let's fix it - PHP Master Series 2012
Your code sucks, let's fix it - PHP Master Series 2012Your code sucks, let's fix it - PHP Master Series 2012
Your code sucks, let's fix it - PHP Master Series 2012
 
Basics of Java Script (JS)
Basics of Java Script (JS)Basics of Java Script (JS)
Basics of Java Script (JS)
 
Your code sucks, let's fix it (CakeFest2012)
Your code sucks, let's fix it (CakeFest2012)Your code sucks, let's fix it (CakeFest2012)
Your code sucks, let's fix it (CakeFest2012)
 
Javascript
JavascriptJavascript
Javascript
 
Your code sucks, let's fix it - DPC UnCon
Your code sucks, let's fix it - DPC UnConYour code sucks, let's fix it - DPC UnCon
Your code sucks, let's fix it - DPC UnCon
 
Learn css3
Learn css3Learn css3
Learn css3
 
jQuery
jQueryjQuery
jQuery
 
jQuery
jQueryjQuery
jQuery
 
Disregard Inputs, Acquire Zend_Form
Disregard Inputs, Acquire Zend_FormDisregard Inputs, Acquire Zend_Form
Disregard Inputs, Acquire Zend_Form
 
Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101
 
Система рендеринга в Magento
Система рендеринга в MagentoСистема рендеринга в Magento
Система рендеринга в Magento
 
JQuery introduction
JQuery introductionJQuery introduction
JQuery introduction
 
Open Source Search: An Analysis
Open Source Search: An AnalysisOpen Source Search: An Analysis
Open Source Search: An Analysis
 
Jquery-overview
Jquery-overviewJquery-overview
Jquery-overview
 
J query
J queryJ query
J query
 
jQuery introduction
jQuery introductionjQuery introduction
jQuery introduction
 
J query1
J query1J query1
J query1
 
Introduzione JQuery
Introduzione JQueryIntroduzione JQuery
Introduzione JQuery
 

Viewers also liked

Partitions and multi primary edition 3
Partitions and multi primary   edition 3Partitions and multi primary   edition 3
Partitions and multi primary edition 3guest93988b
 
The Creative U
The Creative UThe Creative U
The Creative Ugloson123
 
22學期永和社大2010.0531社團聯展簡報
22學期永和社大2010.0531社團聯展簡報22學期永和社大2010.0531社團聯展簡報
22學期永和社大2010.0531社團聯展簡報禹文 陳
 
largest and heaviest slewing bearings used in deck cranes exported to Europe
largest and heaviest slewing bearings used in deck cranes exported to Europelargest and heaviest slewing bearings used in deck cranes exported to Europe
largest and heaviest slewing bearings used in deck cranes exported to EuropeTHB BEARINGS CO.,Ltd
 
Totally Excellent Tips for Righteous Local SEO
Totally Excellent Tips for Righteous Local SEOTotally Excellent Tips for Righteous Local SEO
Totally Excellent Tips for Righteous Local SEOGreg Gifford
 
CREATIVITY: Renew Your Thinking, Transform Your Life
CREATIVITY: Renew Your Thinking, Transform Your LifeCREATIVITY: Renew Your Thinking, Transform Your Life
CREATIVITY: Renew Your Thinking, Transform Your LifeEfiong Etuk
 
Shall we play a game?
Shall we play a game?Shall we play a game?
Shall we play a game?Maciej Lasyk
 
Study: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsStudy: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsLinkedIn
 
UX, ethnography and possibilities: for Libraries, Museums and Archives
UX, ethnography and possibilities: for Libraries, Museums and ArchivesUX, ethnography and possibilities: for Libraries, Museums and Archives
UX, ethnography and possibilities: for Libraries, Museums and ArchivesNed Potter
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerLuminary Labs
 
Designing Teams for Emerging Challenges
Designing Teams for Emerging ChallengesDesigning Teams for Emerging Challenges
Designing Teams for Emerging ChallengesAaron Irizarry
 
Visual Design with Data
Visual Design with DataVisual Design with Data
Visual Design with DataSeth Familian
 
3 Things Every Sales Team Needs to Be Thinking About in 2017
3 Things Every Sales Team Needs to Be Thinking About in 20173 Things Every Sales Team Needs to Be Thinking About in 2017
3 Things Every Sales Team Needs to Be Thinking About in 2017Drift
 
TEDx Manchester: AI & The Future of Work
TEDx Manchester: AI & The Future of WorkTEDx Manchester: AI & The Future of Work
TEDx Manchester: AI & The Future of WorkVolker Hirsch
 

Viewers also liked (20)

Partitions and multi primary edition 3
Partitions and multi primary   edition 3Partitions and multi primary   edition 3
Partitions and multi primary edition 3
 
Phil 700 report
Phil 700 reportPhil 700 report
Phil 700 report
 
The Creative U
The Creative UThe Creative U
The Creative U
 
Joomla
JoomlaJoomla
Joomla
 
Pearl harbro
Pearl harbroPearl harbro
Pearl harbro
 
22學期永和社大2010.0531社團聯展簡報
22學期永和社大2010.0531社團聯展簡報22學期永和社大2010.0531社團聯展簡報
22學期永和社大2010.0531社團聯展簡報
 
largest and heaviest slewing bearings used in deck cranes exported to Europe
largest and heaviest slewing bearings used in deck cranes exported to Europelargest and heaviest slewing bearings used in deck cranes exported to Europe
largest and heaviest slewing bearings used in deck cranes exported to Europe
 
Totally Excellent Tips for Righteous Local SEO
Totally Excellent Tips for Righteous Local SEOTotally Excellent Tips for Righteous Local SEO
Totally Excellent Tips for Righteous Local SEO
 
Pénfigo
PénfigoPénfigo
Pénfigo
 
Projeto gelo
Projeto geloProjeto gelo
Projeto gelo
 
CREATIVITY: Renew Your Thinking, Transform Your Life
CREATIVITY: Renew Your Thinking, Transform Your LifeCREATIVITY: Renew Your Thinking, Transform Your Life
CREATIVITY: Renew Your Thinking, Transform Your Life
 
Shall we play a game?
Shall we play a game?Shall we play a game?
Shall we play a game?
 
Study: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsStudy: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving Cars
 
UX, ethnography and possibilities: for Libraries, Museums and Archives
UX, ethnography and possibilities: for Libraries, Museums and ArchivesUX, ethnography and possibilities: for Libraries, Museums and Archives
UX, ethnography and possibilities: for Libraries, Museums and Archives
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI Explainer
 
Designing Teams for Emerging Challenges
Designing Teams for Emerging ChallengesDesigning Teams for Emerging Challenges
Designing Teams for Emerging Challenges
 
Visual Design with Data
Visual Design with DataVisual Design with Data
Visual Design with Data
 
3 Things Every Sales Team Needs to Be Thinking About in 2017
3 Things Every Sales Team Needs to Be Thinking About in 20173 Things Every Sales Team Needs to Be Thinking About in 2017
3 Things Every Sales Team Needs to Be Thinking About in 2017
 
TEDx Manchester: AI & The Future of Work
TEDx Manchester: AI & The Future of WorkTEDx Manchester: AI & The Future of Work
TEDx Manchester: AI & The Future of Work
 
Build Features, Not Apps
Build Features, Not AppsBuild Features, Not Apps
Build Features, Not Apps
 

Similar to Jquery presentation

Getting Started with jQuery
Getting Started with jQueryGetting Started with jQuery
Getting Started with jQueryShea Frederick
 
Introduction to jQuery
Introduction to jQueryIntroduction to jQuery
Introduction to jQueryGunjan Kumar
 
Jquery tutorial
Jquery tutorialJquery tutorial
Jquery tutorialBui Kiet
 
GDI Seattle - Intro to JavaScript Class 4
GDI Seattle - Intro to JavaScript Class 4GDI Seattle - Intro to JavaScript Class 4
GDI Seattle - Intro to JavaScript Class 4Heather Rock
 
Intro to jQuery
Intro to jQueryIntro to jQuery
Intro to jQueryAlan Hecht
 
Javascript
JavascriptJavascript
Javascripttimsplin
 
Django - Framework web para perfeccionistas com prazos
Django - Framework web para perfeccionistas com prazosDjango - Framework web para perfeccionistas com prazos
Django - Framework web para perfeccionistas com prazosIgor Sobreira
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
Unobtrusive javascript with jQuery
Unobtrusive javascript with jQueryUnobtrusive javascript with jQuery
Unobtrusive javascript with jQueryAngel Ruiz
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
JavaScript: Ajax & DOM Manipulation
JavaScript: Ajax & DOM ManipulationJavaScript: Ajax & DOM Manipulation
JavaScript: Ajax & DOM Manipulationborkweb
 

Similar to Jquery presentation (20)

J Query Public
J Query PublicJ Query Public
J Query Public
 
jQuery
jQueryjQuery
jQuery
 
Getting Started with jQuery
Getting Started with jQueryGetting Started with jQuery
Getting Started with jQuery
 
Introduction to jQuery
Introduction to jQueryIntroduction to jQuery
Introduction to jQuery
 
Jquery tutorial
Jquery tutorialJquery tutorial
Jquery tutorial
 
GDI Seattle - Intro to JavaScript Class 4
GDI Seattle - Intro to JavaScript Class 4GDI Seattle - Intro to JavaScript Class 4
GDI Seattle - Intro to JavaScript Class 4
 
Intro to jQuery
Intro to jQueryIntro to jQuery
Intro to jQuery
 
Introduction to JQuery
Introduction to JQueryIntroduction to JQuery
Introduction to JQuery
 
Javascript
JavascriptJavascript
Javascript
 
Jquery fundamentals
Jquery fundamentalsJquery fundamentals
Jquery fundamentals
 
Jquery
JqueryJquery
Jquery
 
Django - Framework web para perfeccionistas com prazos
Django - Framework web para perfeccionistas com prazosDjango - Framework web para perfeccionistas com prazos
Django - Framework web para perfeccionistas com prazos
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
Unobtrusive javascript with jQuery
Unobtrusive javascript with jQueryUnobtrusive javascript with jQuery
Unobtrusive javascript with jQuery
 
jQuery basics
jQuery basicsjQuery basics
jQuery basics
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
J query training
J query trainingJ query training
J query training
 
JavaScript: Ajax & DOM Manipulation
JavaScript: Ajax & DOM ManipulationJavaScript: Ajax & DOM Manipulation
JavaScript: Ajax & DOM Manipulation
 

Recently uploaded

Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on ThanabotsContinuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on ThanabotsLeah Henrickson
 
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptxHarnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptxFIDO Alliance
 
State of the Smart Building Startup Landscape 2024!
State of the Smart Building Startup Landscape 2024!State of the Smart Building Startup Landscape 2024!
State of the Smart Building Startup Landscape 2024!Memoori
 
Using IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & IrelandUsing IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & IrelandIES VE
 
Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024Hiroshi SHIBATA
 
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...ScyllaDB
 
Event-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream ProcessingEvent-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream ProcessingScyllaDB
 
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfHow Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfFIDO Alliance
 
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfThe Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfFIDO Alliance
 
Breaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdfBreaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdfUK Journal
 
Intro to Passkeys and the State of Passwordless.pptx
Intro to Passkeys and the State of Passwordless.pptxIntro to Passkeys and the State of Passwordless.pptx
Intro to Passkeys and the State of Passwordless.pptxFIDO Alliance
 
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The InsideCollecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The InsideStefan Dietze
 
WebRTC and SIP not just audio and video @ OpenSIPS 2024
WebRTC and SIP not just audio and video @ OpenSIPS 2024WebRTC and SIP not just audio and video @ OpenSIPS 2024
WebRTC and SIP not just audio and video @ OpenSIPS 2024Lorenzo Miniero
 
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...ScyllaDB
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfSrushith Repakula
 
Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Patrick Viafore
 
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdfIntroduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdfFIDO Alliance
 
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider  Progress from Awareness to Implementation.pptxTales from a Passkey Provider  Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider Progress from Awareness to Implementation.pptxFIDO Alliance
 
WebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM PerformanceWebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM PerformanceSamy Fodil
 

Recently uploaded (20)

Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on ThanabotsContinuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
Continuing Bonds Through AI: A Hermeneutic Reflection on Thanabots
 
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptxHarnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
Harnessing Passkeys in the Battle Against AI-Powered Cyber Threats.pptx
 
State of the Smart Building Startup Landscape 2024!
State of the Smart Building Startup Landscape 2024!State of the Smart Building Startup Landscape 2024!
State of the Smart Building Startup Landscape 2024!
 
Using IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & IrelandUsing IESVE for Room Loads Analysis - UK & Ireland
Using IESVE for Room Loads Analysis - UK & Ireland
 
Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024Long journey of Ruby Standard library at RubyKaigi 2024
Long journey of Ruby Standard library at RubyKaigi 2024
 
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
Event-Driven Architecture Masterclass: Engineering a Robust, High-performance...
 
Event-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream ProcessingEvent-Driven Architecture Masterclass: Challenges in Stream Processing
Event-Driven Architecture Masterclass: Challenges in Stream Processing
 
Overview of Hyperledger Foundation
Overview of Hyperledger FoundationOverview of Hyperledger Foundation
Overview of Hyperledger Foundation
 
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfHow Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
 
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdfThe Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
The Value of Certifying Products for FDO _ Paul at FIDO Alliance.pdf
 
Breaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdfBreaking Down the Flutterwave Scandal What You Need to Know.pdf
Breaking Down the Flutterwave Scandal What You Need to Know.pdf
 
Intro to Passkeys and the State of Passwordless.pptx
Intro to Passkeys and the State of Passwordless.pptxIntro to Passkeys and the State of Passwordless.pptx
Intro to Passkeys and the State of Passwordless.pptx
 
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The InsideCollecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
Collecting & Temporal Analysis of Behavioral Web Data - Tales From The Inside
 
WebRTC and SIP not just audio and video @ OpenSIPS 2024
WebRTC and SIP not just audio and video @ OpenSIPS 2024WebRTC and SIP not just audio and video @ OpenSIPS 2024
WebRTC and SIP not just audio and video @ OpenSIPS 2024
 
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
Event-Driven Architecture Masterclass: Integrating Distributed Data Stores Ac...
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdf
 
Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024
 
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdfIntroduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
Introduction to FDO and How It works Applications _ Richard at FIDO Alliance.pdf
 
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider  Progress from Awareness to Implementation.pptxTales from a Passkey Provider  Progress from Awareness to Implementation.pptx
Tales from a Passkey Provider Progress from Awareness to Implementation.pptx
 
WebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM PerformanceWebAssembly is Key to Better LLM Performance
WebAssembly is Key to Better LLM Performance
 

Jquery presentation

  • 1.  
  • 2.
  • 3.
  • 4.
  • 5.
  • 6. It’s just a single line in jQuery $(“#content”).load(“page.html #content”);
  • 7. Who’s using jQuery? http:// docs.jquery.com/Sites_Using_jQuery
  • 8.
  • 9.
  • 10.
  • 11.
  • 12. $(“div”). addClass(“xyz”); Find Some Elements Do something with them { } jQuery Object jQuery philosophy
  • 13. A Basic Example <body> <div> <p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div> <p>I m another paragraph</p> </body>
  • 14. A Basic Example <body> <div> <p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div> <p>I m another paragraph</p> </body> Select all paragraphs. $(“p”)
  • 15. A Basic Example <body> <div> <p class=“red”>I m a paragraph -1</p> <p class=“red”>I m a paragraph -2</p> </div> <p class=“red”>I m another paragraph</p> </body> Select all paragraphs. Add a class to them. $(“p”).addClass(“red”);
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28. Basic Filters Example Student list table. Lets make it zebra. Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 Mizan XII 5 Karim VI 2 Satisfactory
  • 29. Basic Filters Example $(“#students tr:even”).css(“background-color”, “#dde”) Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 Mizan XII 5 Karim VI 2 Satisfactory
  • 30.
  • 31. Content Filters Example $(“#students tr:even”).css(“background-color”, “#dde”); $(“#students td.comment:empty”).text(“No Comment”); Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 No Comment Mizan XII 5 No Comment Karim VI 2 Satisfactory
  • 32.
  • 33. Attribute Filters Example $(“#students tr:even”).css(“background-color”, “#dde”); $(“#students td.comment:empty”).text(“No Comment”); $(“#students td[align=‘center']&quot;).addClass(“ocean”); Name Class Roll No. Comment Raju XII 2 Good Masud IX 1 Good Apu XII 3 No Comment Mizan XII 5 No Comment Karim VI 2 Satisfactory
  • 34.
  • 35. Forms Selector Example $(&quot;:submit&quot;) .click(function(e){ … }); $(&quot;input:disabled&quot;) .val(“You cannot change me&quot;); $(“#form-id input:checked”) .addClass(“selected”);
  • 36. Now we can Select Let’s perform some action
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60. jQuery Plugins jQuery is extensible.
  • 61.
  • 62.
  • 63. And thousands of more… http://plugins.jquery.com/
  • 64.
  • 65. jQuery UI – Interactions (Draggale, Droppable, Resizable, Selectable, Sortable)
  • 66.
  • 67. jQuery UI – Widgets (Accordion, Datepicker, Dialog, Progressbar, Slider, Tabs)
  • 68. jQuery UI – Datepicker Example $(&quot;#date&quot;).datepicker();
  • 69. Which one will match your site?
  • 70. Designing a jQuery UI theme - Themeroller http://ui.jquery.com/themeroller
  • 71. Anis uddin Ahmad Sr. Software Engineer Right Brain Solution Ltd. http://ajaxray.com