ChidresTechTutorials
ChidresTechTutorials
  • 1 806
  • 10 138 602
jQuery Get Set Dimension Functions - jQuery Tutorial 40
Notes for You:: jQuery Get & Set Dimension Functions:
- are used to get or set dimensions of an HTML element(s)
width()
- returns content area width
height()
- returns content area height
innerWidth()
- returns content area width + left padding + right padding
innerHeight()
- returns content area height + top padding + bottom padding
outerWidth()
- returns content area width + left padding + right padding + left border + right border
outerHeight()
- returns content area height + top padding + bottom padding + top border + bottom border
outerWidth(true)
- returns content area width + left padding + right padding + left border + right border + left margin + right margin
outerHeight(true)
- returns content area height + top padding + bottom padding + top border + bottom border + top margin + bottom margin
=========================================
Follow the link for previous video:
ua-cam.com/video/7RXM50EduDo/v-deo.html
=========================================
jQuery Tutorials Playlist:-
ua-cam.com/play/PLdE8ESr9Th_vu5OoXCwcHsudbR7qw82uU.html
=========================================
Watch My Other Useful Tutorials:-
jQuery UI Tutorials Playlist:-
ua-cam.com/play/PLdE8ESr9Th_uPD8DDjeRyN7-BxGGGK6bO.html
Bootstrap Tutorials Playlist:-
ua-cam.com/play/PLdE8ESr9Th_vnCOUPx1fhQLRZGENyfuMG.html
Dreamweaver Tutorials Playlist:-
ua-cam.com/play/PLdE8ESr9Th_sGP0m9D68jHqZQr_qRzDXk.html
=========================================
► Subscribe to our UA-cam channel:
ua-cam.com/users/chidrestechtutorials
► Visit our Website:
www.chidrestechtutorials.com
=========================================
Hash Tags:-
#ChidresTechTutorials #jQuery #jQueryTutorial
Переглядів: 28

Відео

jQuery CSS Styling Functions - jQuery Tutorial 397:06jQuery CSS Styling Functions - jQuery Tutorial 39
jQuery CSS Styling Functions - jQuery Tutorial 39
Переглядів 464 години тому
Notes for You:: jQuery CSS Styling Functions - are used to apply CSS styles to an HTML element(s) css(): $("#first-div").css("border","2px solid red"); $("#first-div").css({"border":"2px solid red","color":"red"}); addClass(): $("#first-div").addClass("first-div-styles"); removeClass(): $("#first-div").removeClass("first-div-styles"); toggleClass(): $("#first-div").toggleClass("first-div-styles...
jQuery Add Remove Content Functions - jQuery Tutorial 386:17jQuery Add Remove Content Functions - jQuery Tutorial 38
jQuery Add Remove Content Functions - jQuery Tutorial 38
Переглядів 437 годин тому
Notes for You:: jQuery Add Content Functions: append(): adds the given content after the content of selected HTML element(s) $("div").append("<h2>Heading text</h2>"); prepend(): adds the given content before the content of selected HTML element(s) $("div").prepend("<h2>Heading text</h2>"); after(): adds the given content after the selected HTML element(s) $("div").after("<h2>Heading text</h2>")...
Area Of Circle Calculator App in jQuery11:12Area Of Circle Calculator App in jQuery
Area Of Circle Calculator App in jQuery
Переглядів 587 годин тому
Area Of Circle Calculator App in jQuery
jQuery Get Set Content Functions - jQuery Tutorial 3710:31jQuery Get Set Content Functions - jQuery Tutorial 37
jQuery Get Set Content Functions - jQuery Tutorial 37
Переглядів 519 годин тому
Notes for You:: jQuery Get & Set Content Functions: - are used to get or set content of an HTML element html(): - is used to get or set the content of an HTML element including tags. Ex: alert( $("div").html() ); // get $("div").html("<h2>Heading text</h2>") ; // set text() : - is used to get or set the content (i.e. only text) of an HTML element excluding tags. Ex: alert( $("div").text() ); //...
jQuery On Function - jQuery Tutorial 369:52jQuery On Function - jQuery Tutorial 36
jQuery On Function - jQuery Tutorial 36
Переглядів 2912 годин тому
Notes for You:: jQuery on() function - is used to add one or more events to an HTML element 1. Adding an event using on function Ex : $("p").click(function(){ $(this).text("mouse clicked"); }); $("p").mouseover(function(){ $(this).text("mouse over"); }); $("p").mouseout(function(){ $(this).text("mouse out"); }); OR $("p").on("click",function(){ $(this).text("mouse clicked"); }); $("p").on("mous...
Addition Of Two Numbers App in jQuery11:23Addition Of Two Numbers App in jQuery
Addition Of Two Numbers App in jQuery
Переглядів 10812 годин тому
Addition Of Two Numbers App in jQuery
jQuery Form Events - jQuery Tutorial 358:25jQuery Form Events - jQuery Tutorial 35
jQuery Form Events - jQuery Tutorial 35
Переглядів 4214 годин тому
Notes for You:: jQuery Form Events: - are triggered on the change in status of a form control focus() - is triggered when a form control gets focus Ex: $("input").focus(function(){ $(this).css("border","5px solid green"); }); blur() - is triggered when a form control gets blur Ex: $("input").blur(function(){ $(this).css("border","5px solid red"); }); select() - is triggered when you select the ...
jQuery Keyboard Events - jQuery Tutorial 348:27jQuery Keyboard Events - jQuery Tutorial 34
jQuery Keyboard Events - jQuery Tutorial 34
Переглядів 2816 годин тому
Notes for You:: jQuery Keyboard Events: - are triggered on keyboard input keydown() - triggered as long as you hold down a key on the keyboard. $(document).keydown(function() { $("p").text("keydown"); }); keyup() - triggered once when you release a key; which was held down. $(document).keyup(function() { $("p").text("keyup"); }); keypress() - triggered as long as you hold down a key on the keyb...
jQuery Mouse Events Part2 - jQuery Tutorial 338:27jQuery Mouse Events Part2 - jQuery Tutorial 33
jQuery Mouse Events Part2 - jQuery Tutorial 33
Переглядів 4021 годину тому
Notes for You:: jQuery Mouse events: - mouseenter(), mouseleave() $("p").mouseenter(function(){ $(this).css("background-color","red"); }); $("p").mouseleave(function(){ $(this).css("background-color","white"); }); - mouseover(), mouseout() $("p").mouseover(function(){ $(this).css("background-color","red"); }); $("p").mouseout(function(){ $(this).css("background-color","white"); }); - mousedown(...
jQuery Mouse Events Part1 - jQuery Tutorial 325:21jQuery Mouse Events Part1 - jQuery Tutorial 32
jQuery Mouse Events Part1 - jQuery Tutorial 32
Переглядів 45День тому
Notes for You:: jQuery Mouse events: - click(), dblclick(), hover() $('p').click(function(){ $(this).css("background-color","yellow"); }); $('p').dblclick(function(){ $(this).css("background-color","yellow"); }); $('p').hover(function(){ $(this).css("background-color","yellow"); }); $("p").click(function(){ $(this).hide(1000,function(){ $(this).show(1000); }); }); Follow the link for next video...
jQuery Browser Events - jQuery Tutorial 317:25jQuery Browser Events - jQuery Tutorial 31
jQuery Browser Events - jQuery Tutorial 31
Переглядів 37День тому
Notes for You:: jQuery Browser Events: ready(): - is executed after the page is completely loaded Ex: $(document).ready(function(){ alert("document is completely loaded"); }); scroll(): - is executed while scrolling the page Ex: $(document).scroll(function(){ $("p").text("Scrollbar position:" $(document).scrollTop()); }); Follow the link for next video: ua-cam.com/video/kqGEVW6kI_w/v-deo.html F...
jQuery Custom Effects - jQuery Tutorial 305:27jQuery Custom Effects - jQuery Tutorial 30
jQuery Custom Effects - jQuery Tutorial 30
Переглядів 54День тому
Notes for You:: jQuery Custom Effects: - to add custom effects to selected HTML elements we take help of animate function animate( properties [, duration ] [, easing ] [, callback ] ) Ex: $("p").animate({"opacity":"0", "height":"0px", "overflow":"hidden"},2000, function(){ $("p").animate({"opacity":"1", "height":"200px", "overflow":"hidden"},2000); }); Note: all the CSS properties with numeric ...
jQuery Sliding Effects - jQuery Tutorial 296:05jQuery Sliding Effects - jQuery Tutorial 29
jQuery Sliding Effects - jQuery Tutorial 29
Переглядів 47День тому
Notes for You:: jQuery Sliding Effects: - animate height and overflow properties of an HTML element(s) slideUp( [duration ] [, callback ] ); - wraps the selected HTML element(s) up Ex: $("p").slideUp(1000); slideDown( [duration ] [,callback] ); - unwraps the selected HTML element(s) down Ex: $("p").slideUp(1000, function(){ $("p").slideDown(1000); }); slideToggle( [duration ] [,callback] ); - w...
jQuery Fading Effects - jQuery Tutorial 287:09jQuery Fading Effects - jQuery Tutorial 28
jQuery Fading Effects - jQuery Tutorial 28
Переглядів 3714 днів тому
Notes for You:: jQuery Fading Effects: - animate opacity property of an HTML element(s) fadeOut([duration], [callback]); - fades out the selected HTML element(s) by setting their opacity property to 0 Ex: $('p').fadeOut(1000); fadeIn([duration], [callback]); - fades in the selected HTML element(s) by setting their opacity property to 1 Ex: $('p').fadeOut(1000,function(){ $('p').fadeIn(1000); })...
jQuery Visibility Effects - jQuery Tutorial 277:42jQuery Visibility Effects - jQuery Tutorial 27
jQuery Visibility Effects - jQuery Tutorial 27
Переглядів 7814 днів тому
jQuery Visibility Effects - jQuery Tutorial 27
jQuery Filter Methods - jQuery Tutorial 267:23jQuery Filter Methods - jQuery Tutorial 26
jQuery Filter Methods - jQuery Tutorial 26
Переглядів 6014 днів тому
jQuery Filter Methods - jQuery Tutorial 26
jQuery Getting Siblings - jQuery Tutorial 258:17jQuery Getting Siblings - jQuery Tutorial 25
jQuery Getting Siblings - jQuery Tutorial 25
Переглядів 4314 днів тому
jQuery Getting Siblings - jQuery Tutorial 25
jQuery Getting Descendants - jQuery Tutorial 247:47jQuery Getting Descendants - jQuery Tutorial 24
jQuery Getting Descendants - jQuery Tutorial 24
Переглядів 5314 днів тому
jQuery Getting Descendants - jQuery Tutorial 24
jQuery Getting Ancestors - jQuery Tutorial 236:46jQuery Getting Ancestors - jQuery Tutorial 23
jQuery Getting Ancestors - jQuery Tutorial 23
Переглядів 9414 днів тому
jQuery Getting Ancestors - jQuery Tutorial 23
jQuery Universal Selector - jQuery Tutorial 225:20jQuery Universal Selector - jQuery Tutorial 22
jQuery Universal Selector - jQuery Tutorial 22
Переглядів 4521 день тому
jQuery Universal Selector - jQuery Tutorial 22
jQuery Attribute Selector - jQuery Tutorial 2110:24jQuery Attribute Selector - jQuery Tutorial 21
jQuery Attribute Selector - jQuery Tutorial 21
Переглядів 5221 день тому
jQuery Attribute Selector - jQuery Tutorial 21
jQuery Sibling Selector - jQuery Tutorial 209:53jQuery Sibling Selector - jQuery Tutorial 20
jQuery Sibling Selector - jQuery Tutorial 20
Переглядів 5321 день тому
jQuery Sibling Selector - jQuery Tutorial 20
jQuery Direct Child Selector - jQuery Tutorial 198:09jQuery Direct Child Selector - jQuery Tutorial 19
jQuery Direct Child Selector - jQuery Tutorial 19
Переглядів 4521 день тому
jQuery Direct Child Selector - jQuery Tutorial 19
jQuery Descendant Selector - jQuery Tutorial 187:14jQuery Descendant Selector - jQuery Tutorial 18
jQuery Descendant Selector - jQuery Tutorial 18
Переглядів 6621 день тому
jQuery Descendant Selector - jQuery Tutorial 18
Inline, Embedded and External JavaScript | 3 Ways to Add JavaScript to HTML10:47Inline, Embedded and External JavaScript | 3 Ways to Add JavaScript to HTML
Inline, Embedded and External JavaScript | 3 Ways to Add JavaScript to HTML
Переглядів 95Місяць тому
Inline, Embedded and External JavaScript | 3 Ways to Add JavaScript to HTML
Yes, I DID IT! Celebrating 100k Subscribers on YouTube 🚀🥂 #dream #happy #celebration1:10Yes, I DID IT! Celebrating 100k Subscribers on YouTube 🚀🥂 #dream #happy #celebration
Yes, I DID IT! Celebrating 100k Subscribers on YouTube 🚀🥂 #dream #happy #celebration
Переглядів 110Місяць тому
Yes, I DID IT! Celebrating 100k Subscribers on UA-cam 🚀🥂 #dream #happy #celebration
Bitwise Operators in JAVA - JAVA Tutorial 2511:05Bitwise Operators in JAVA - JAVA Tutorial 25
Bitwise Operators in JAVA - JAVA Tutorial 25
Переглядів 84Місяць тому
Bitwise Operators in JAVA - JAVA Tutorial 25
Bitwise Operators in C# - C# Tutorial 2612:12Bitwise Operators in C# - C# Tutorial 26
Bitwise Operators in C# - C# Tutorial 26
Переглядів 1092 місяці тому
Bitwise Operators in C# - C# Tutorial 26
Bitwise Operators in C++ - C++ Tutorial 2812:23Bitwise Operators in C++ - C++ Tutorial 28
Bitwise Operators in C++ - C++ Tutorial 28
Переглядів 862 місяці тому
Bitwise Operators in C - C Tutorial 28

КОМЕНТАРІ

  • @999suj
    @999suj 2 години тому

    omg its my luck that today i came across your videos while surfing, you are amazing..... thank you.

  • @mdsobuzislam2588
    @mdsobuzislam2588 7 годин тому

    I like this video

  • @compsciencenerd
    @compsciencenerd День тому

    Wow you are amazing, Sir. Your way to explanation is fit to my autistic brain that desire well structure and detail materi. Good job, Sir. Thankyou very much

  • @angaragangabhavyasri415
    @angaragangabhavyasri415 День тому

    Such useful videos thank you sir

  • @mdsobuzislam2588
    @mdsobuzislam2588 2 дні тому

    ❤

  • @akay995
    @akay995 2 дні тому

    This is the best explanation in the world! Thanks man!

  • @mdsobuzislam2588
    @mdsobuzislam2588 2 дні тому

    Wow

  • @shutianwang5799
    @shutianwang5799 2 дні тому

    God I find flash tutorial in 2024

  • @mdsobuzislam2588
    @mdsobuzislam2588 3 дні тому

    Good

  • @syedmohsin572
    @syedmohsin572 3 дні тому

    wow

  • @KOMEK1999
    @KOMEK1999 4 дні тому

    Well explained Sir ❤

  • @abiolafolarin-lp8do
    @abiolafolarin-lp8do 4 дні тому

    Thank you very much sir i really appreciate ur effort in making us to understand Css... God bless you sir ❤

  • @85MA
    @85MA 5 днів тому

    Amazing presentation its simple yet comprehensive.. Keep coming amazing content like this. hats off to you sir! Thank you.

  • @85MA
    @85MA 7 днів тому

    A LAYOUT RESCUE REQUEST FROM PAKKSTAN. I was trying to create the below layout using the float property, the outcome was a mess..... * A navbar at the top with a width of 100%. * A sidebar on the left with THREE stacked boxes within sidebar, each 20% wide and with a height of 100px,200px,300px each. * A main section in the middle, 60% wide, with the same height as the left 3 boxes of the sidebars. * A sidebar on the right with TWO stacked sections, each 20% wide and 200px height. * A footer at the bottom with a width of 100%. My humble request to please make a tutorial video on this as early as u can.. Thanks in advance from Pakistan.

    • @ChidresTechTutorials
      @ChidresTechTutorials 6 днів тому

      Can you share layout image to mass45688@gmail.com

    • @85MA
      @85MA 6 днів тому

      @@ChidresTechTutorials Thank you so much for considering my request. I really appreciate it. I sent you an email with the attachment of requested layout. I didn't mentioned the height and width of this layout and the divs inside you can choose as per the design's requirements. Thank you

    • @ChidresTechTutorials
      @ChidresTechTutorials 6 днів тому

      @@85MA great

  • @sreemanthkumar777
    @sreemanthkumar777 8 днів тому

    Clear and precise explanation Sir. Thank you

  • @prabhatadvait6171
    @prabhatadvait6171 9 днів тому

    You are doing very nice work

  • @BonthalaRamesh
    @BonthalaRamesh 10 днів тому

    Sir do you running any offline classes and where.. please reply sir.

  • @honeymavi5587
    @honeymavi5587 10 днів тому

    Best Teacher For html And css , Pata ni pehle kyu nahi mili aaapki playlists 😢

  • @omeghana
    @omeghana 10 днів тому

    simple and nice explaination

  • @honeymavi5587
    @honeymavi5587 11 днів тому

    Great , part 4 sir ?

  • @AbukarAli-wz7ft
    @AbukarAli-wz7ft 11 днів тому

    Thank you sir

  • @WorldWorrier3273
    @WorldWorrier3273 15 днів тому

    Hey Bro 😃, Pleaseeeeee make a Playlist On " VFX Graph 🔥 : in URP " of Unity in details . I'm Asking you Because, You've in-depth Knowledge in Unity 😊

  • @rojaramanilola1317
    @rojaramanilola1317 16 днів тому

    Where create layouts

    • @ChidresTechTutorials
      @ChidresTechTutorials 16 днів тому

      Pardon

    • @rojaramanilola1317
      @rojaramanilola1317 16 днів тому

      Wt is pardon

    • @ChidresTechTutorials
      @ChidresTechTutorials 15 днів тому

      @@rojaramanilola1317 Pardon means. I am not able to understand your question about web layouts. can you please describe your question little more?

    • @rojaramanilola1317
      @rojaramanilola1317 15 днів тому

      Sir I want to create a Webpage layout using html and css so wt is the clear process please tell me sir

    • @ChidresTechTutorials
      @ChidresTechTutorials 15 днів тому

      @@rojaramanilola1317 Watch this complete playlist: ua-cam.com/play/PLdE8ESr9Th_uU8IAMv4MQDAsD0z7Aj4hr.html

  • @umairjon7389
    @umairjon7389 16 днів тому

    Thanks you very much

  • @sakshisolkar0909
    @sakshisolkar0909 17 днів тому

    Thank you so much sir. You explained this topic in very easy language.

  • @tirumalamahimarani5725
    @tirumalamahimarani5725 17 днів тому

    Thank you so much sir,clear explanation🤗🤗

  • @FeedingWolves
    @FeedingWolves 17 днів тому

    Thank you so much for this video!! Excellent resource!

  • @MoshpitTrucker
    @MoshpitTrucker 18 днів тому

    Best video I have found. Currently on otr trucker, on my down time I'm hoping to freelance simple work. The way you explaind how the div works to top notch

  • @sanat632
    @sanat632 19 днів тому

    Sir aap vs code mein coding kigiye please..it will help to read better...

  • @redify1772
    @redify1772 21 день тому

    Nice .. keep it up

  • @user-zm1hy9lo2e
    @user-zm1hy9lo2e 21 день тому

    can't we do this function on button type submit?

  • @Algrebasandy
    @Algrebasandy 22 дні тому

    👏👏

  • @rsaramram108
    @rsaramram108 24 дні тому

    Congratulations 🎉🎉🎉

    • @ChidresTechTutorials
      @ChidresTechTutorials 24 дні тому

      Thank you 🙏💕 for the wishes . I am creating video tutorials for Computer Science, Engineering, Information Technology, Gaming, Multimedia and Artificial intelligence students👦📖🎒 Please share with a student in need and support💪

  • @aha4079
    @aha4079 29 днів тому

    You are very helpful channel for a beginner like me. Hope you also do python and about databases.

    • @ChidresTechTutorials
      @ChidresTechTutorials 29 днів тому

      Sure will try my best 👍💯 thank you🙏 please share and support💪

  • @Somali4English
    @Somali4English 29 днів тому

    Thanks for the helping students. I would also like to add web layout design #using CSS GRID Box module to be more up to date.

  • @aha4079
    @aha4079 29 днів тому

    bullseye! This is the best beginner's html video tutiorial!

    • @ChidresTechTutorials
      @ChidresTechTutorials 29 днів тому

      Thank you 🙏💕 for the 👍💯 . I am creating video tutorials for Computer Science, Engineering, Information Technology, Gaming, Multimedia and Artificial intelligence students👦📖🎒 Please share with a student in need and support💪

  • @Aklord7
    @Aklord7 Місяць тому

    Html tag

  • @ChidresTechTutorials
    @ChidresTechTutorials Місяць тому

    Answer the following question: 1) Define Inline JavaScript ? 2) Define Embedded JavaScript ? 3) Define External JavaScript ?

  • @alameen.5263
    @alameen.5263 Місяць тому

    Your vids are very nice and simplified. However, I feel the code can be a lot more simplified for the flexbox series. The approach you demonstrated suggests unsemantic html file

  • @AnitaChidre
    @AnitaChidre Місяць тому

    Congratulations 👏🎉

    • @ChidresTechTutorials
      @ChidresTechTutorials Місяць тому

      Thank you 🙏💕 for the wishes . I am creating video tutorials for Computer Science, Engineering, Information Technology, Gaming, Multimedia and Artificial intelligence students👦📖🎒 Please share with a student in need and support💪