Projects in Awesome Lists tagged with add-event-listener
A curated list of projects in awesome lists tagged with add-event-listener .
https://github.com/sofiane-abou-abderrahim/javascript-favorite-movies
Here is a tiny application with quite some verbose code because I wanted to practice what I learned and use different alternatives related to JavaScript and DOM traversal. Indeed, I used most of the crucial fundamentals needed to work with elements and manipulate a page whilst it's running in the browser.
add-elements add-event-listener attributes children classes dom-manipulation dom-traversal javascript nodes properties remove-elements select-elements styles swap-elements
Last synced: 03 Apr 2025
https://github.com/drakealia/js-modal
Learning how to create a modal window which is used on websites to get users to do or see something specific. Example being you can create a modal window that warns them to save their changes or else that information will be lost. Based on John Smilga's js course
add-event-listener class-list-add class-list-remove document-queryselector
Last synced: 22 Feb 2025
https://github.com/drakealia/js-slider
Learning how to build an image slider that you can add to any website. Based on John Smilga's js course
add-event-listener for-each if-else query-selector-all
Last synced: 22 Feb 2025
https://github.com/drakealia/js-video
Learning how to make a video background with a play and pause feature. This is a common feature found in a lot of websites. Based on John Smilga's js course
add-event-listener class-list-add class-list-contains class-list-remove document-queryselector pause play
Last synced: 22 Feb 2025
https://github.com/drakealia/color-flipper
Learning how to create a random background color changer. This is a good project to get you started working with the DOM. Based on John Smilga's js course
add-event-listener array-length arrays document-body-style-backgroundcolor document-getelementbyid document-queryselector math-floor math-random
Last synced: 22 Feb 2025
https://github.com/drakealia/js-questions
Learning how to create a frequently asked questions page which educates users about a business and drives traffic to the website through organic search results. Based on John Smilga's js course
add-event-listener class-list-remove class-list-toggle document-queryselector for-each
Last synced: 22 Feb 2025
https://github.com/drakealia/js-counter
Learning how to create a counter and write conditions that change the color based on positive or negative numbers displayed. Based on John Smilga's js course
add-event-listener class-list current-target document-queryselector for-each text-content
Last synced: 22 Feb 2025
https://github.com/drakealia/js-tabs
Learning how to create tabs that will display different content which is useful when creating single page applications. Based on John Smilga's js course
add-event-listener class-list-add class-list-remove foreach
Last synced: 22 Feb 2025
https://github.com/drakealia/js-navbar
Learning how to create a responsive navbar that will show the hamburger menu for smaller devices. Based John Smilga's js course
add-event-listener class-list-toggle document-queryselector
Last synced: 22 Feb 2025
https://github.com/drakealia/js-sidebar
Learning how to create a sidebar with animation. Based on John Smilga's js course
add-event-listener class-list-remove class-list-toggle document-queryselector
Last synced: 22 Feb 2025
https://github.com/derektypist/build-a-calorie-counter
Learn Form Validation by Building a Calorie Counter. JavaScript Algorithms and Data Structures. How to validate user input, perform calculations based on that input and dynamically update the interface. Use of regular expressions, template literals, the addEventListener() method and more.
add-event-listener css3 form-validation forms html5 javascript regular-expressions template-literals
Last synced: 22 Mar 2025
https://github.com/drakealia/js-reviews
Learning how to create a carousel of reviews with a button that generates random reviews. Based on John Smilga's js course
add-event-listener array-length dom-content-loaded objects text-content
Last synced: 22 Feb 2025