Skip to content

Latest commit

 

History

History
182 lines (175 loc) · 5.97 KB

README.md

File metadata and controls

182 lines (175 loc) · 5.97 KB
Raw

Projects-MadeBy-JavaScript

JavaScript Projects for Practice – Easy Ideas to Coding JS.

preview

31 Mini Project.:fire:

List of Projects

  • Color Flipper See in Codepen ✅

    • arrays
    • getElementById()
    • querySelector()
    • addEventListener()
    • body.style.backgroundColor
    • Math.floor()
    • Math.random()
    • array.length

  • Counter See in Codepen ✅

    • querySelectorAll()
    • forEach()
    • addEventListener()
    • currentTarget property
    • classList
    • textContent

  • Review Carousel See in Codepen ✅

    • objects
    • DOMContentLoaded
    • addEventListener()
    • array.length
    • textContent

  • Responsive Navbar See in Codepen ✅

    • querySelector()
    • addEventListener()
    • classList.toggle()

  • 🔥Sidebar See in Codepen ✅

    • querySelector()
    • addEventListener()
    • classList.toggle()
    • classList.remove()

  • Modal High See in Codepen ✅

    • querySelector()
    • addEventListener()
    • classList.add()
    • classList.remove()

  • 🔥Modal See in Codepen ✅

    • addEventListener()
    • classList.add()
    • classList.remove()

  • FAQ Page See in Codepen ✅

    • querySelectorAll()
    • addEventListener()
    • forEach()
    • classList.remove()
    • classList.toggle()

  • 🔥Restaurant Menu Page See in Codepen ✅

    • arrays
    • objects
    • forEach()
    • DOMContentLoaded
    • map, reduce, and filter
    • innerHTML
    • includes method

  • Video Background See in Codepen ✅

    • document.querySelector()
    • addEventListener()
    • classList.contains()
    • classList.add()
    • classList.remove()
    • play()
    • pause()

  • 🔥Form Validation See in Codepen ✅

    • querySelector()
    • conditions
    • querySelectorAll()

  • Color Change See in Codepen ✅

    • querySelector()
    • Math.floor()
    • Math.random()
    • colors

  • 🔥Book A Ticket See in Codepen ✅

    • querySelectorAll()
    • querySelector()
    • array
    • options

  • Convert Temp See in Codepen ✅

    • querySelectorAll()
    • querySelector()
    • Math
    • actions

  • 🔥Key Code See in Codepen ✅

    • querySelector()
    • getElementById()
    • keyboard event

  • Show Password See in Codepen ✅

    • getElementByClassName()
    • getElementById()
    • class list
    • querySelector()

  • Range Slider See in Codepen ✅

    • range slider
    • input
    • querySelector()

  • Dynamic Theme See in Codepen ✅

    • class list
    • querySelector()

  • Custom Scroll Bar See in Codepen ✅

    • scroll
    • events
    • DOM
    • querySelector()

  • Navigation Bar on Scroll See in Codepen ✅

    • getElementById()
    • getFullYear()
    • getBoundingClientRect()
    • slice method
    • window.scrollTo()

  • 🔥Tabs that display different content See in Codepen ✅

    • classList.add()
    • classList.remove()
    • forEach()
    • addEventListener()

  • 🔥Countdown Clock See in Codepen ✅

    • getFullYear()
    • getMonth()
    • getDate()
    • Math.floor()
    • setInterval()
    • clearInterval()

  • Your Own Lorem ipsum See in Codepen ✅

    • parseInt()
    • Math.floor()
    • Math.random()
    • isNaN()
    • slice method
    • event.preventDefault()

  • Grocery List See in Codepen ✅

    • DOMContentLoaded
    • new Date()
    • createAttribute()
    • setAttributeNode()
    • appendChild()
    • filter()
    • map()

  • 🔥Custom Context Menu See in Codepen ✅

    • context menu
    • pageX, pageY
    • events
    • querySelector()

  • Max Length input See in Codepen ✅

    • input
    • key events
    • querySelector()

  • 🔥Todo List Local Storage See in Codepen ✅

    • local storage
    • key events
    • arrays
    • jsons
    • splice

  • Image Slider See in Codepen ✅

    • setInterval
    • class list
    • events
    • addEventListener()
    • querySelector()

  • 🔥BMI Calculator See in Codepen ✅

    • events
    • addEventListener()
    • querySelector()

  • Animated Keyboard See in Codepen ✅

    • events
    • addEventListener()
    • querySelector()

  • 🔥Pagination See in Codepen ✅

    • Math.ceil
    • class list
    • array
    • appendChild()
    • events