Category: JavaScript

  • Understanding Vue.js Components and Props: A Practical Example

    Understanding Vue.js Components and Props: A Practical Example

    In the world of web development, Vue.js has rapidly gained popularity as a progressive JavaScript framework for building interactive and dynamic user interfaces. With its simplicity and versatility, Vue.js has become a developer favorite. To illustrate how Vue.js works and how components and props function, let’s dissect a simple Vue.js code snippet. Example Code In…

  • Typical .ajax call in jQuery

    Typical .ajax call in jQuery

    Here’s what each part does: Remember, these are just some of the options available in a jQuery AJAX call. There are many other options and methods available, which can provide more control and flexibility over your AJAX requests. You can find more details in the jQuery AJAX documentation.

  • Parallax Banner

    Parallax Banner

    Creating a parallax effect for a banner can be achieved using CSS and JavaScript. The basic idea of the parallax effect is that the background content (e.g., an image) and the foreground content (e.g., text) move at different speeds when the user scrolls, giving the illusion of depth.

  • Now I See You, Now I  toggle()

    Now I See You, Now I toggle()

    You can use jQuery’s toggle() method to toggle the visibility of an element. Here is a simple example: This line of code will hide the element if it is currently visible and show it if it is currently hidden. Here’s a more complete example with a button that toggles the visibility of a div: In…

  • Run jQuery after DOM Manipulation

    Run jQuery after DOM Manipulation

    To run a jQuery function after the DOM has been manipulated, you can use the .ready() function or the .on() function with the DOMSubtreeModified event. Here are examples of both approaches: Using .ready(): This function will be called once the DOM has been fully loaded and is ready for manipulation. Any code you place inside…

  • Spread Operator …

    Spread Operator …

    In JavaScript, the … syntax is called the “spread operator.” It is also difficult to Google!

  • List All Blocks in the Console

    List All Blocks in the Console

    You can get an array of all the blocks used in your editor by going to the inspector console and using this bit of code. In this array, you can see all the attributes for each! So, if you need to approach the editor as a whole, as in, all the blocks and not just…

  • Ternary Operator

    Ternary Operator

    Inline if this then that else this other thing. Handy when you need to do this sort of thing in a template literal.

  • Find that element that goes off page

    Find that element that goes off page

    If an element on the page is wider than the document, it’ll get logged to the console.

  • Javascript OOP

    Javascript OOP

    Javascript Object Oriented Programming basic setup. And I’m using jQuery because, why not? It’s already in WordPress, anyway.