JavaScript COUNTER PROGRAM 🔢

Показать описание

00:00:00 Intro
00:00:27 HTML
00:02:16 CSS
00:05:58 JavaScript

// COUNTER PROGRAM
let count = 0;

count++;
}
count--;
}
count = 0;
}

Рекомендации по теме

Комментарии

// COUNTER PROGRAM
const increaseBtn =
const decreaseBtn =
const resetBtn =
const countLabel =
let count = 0;

increaseBtn.onclick = function(){
count++;
countLabel.textContent = count;
}
decreaseBtn.onclick = function(){
count--;
countLabel.textContent = count;
}
resetBtn.onclick = function(){
count = 0;
countLabel.textContent = count;
}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My website</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<label
<div id="btnContainer">
<button id="decreaseBtn"
<button id="resetBtn"
<button id="increaseBtn"
</div>

<script src="index.js"></script>
</body>
</html>

#countLabel{
display: block;
text-align: center;
font-size: 10em;
font-family: Helvetica;
}
#btnContainer{
text-align: center;
}
.buttons{
padding: 10px 20px;
font-size: 1.5em;
color: white;
background-color: hsl(214, 100%, 74%);
border-radius: 5px;
cursor: pointer;
transition: background-color 0.25s;
}
.buttons:hover{
background-color: hsl(214, 100%, 56%)
}

BroCodez

After you showing the increase it was straight forward after that great video and fun little project

l-fitness

bro thanks for your video not only I learned javascript but also css
keep up the good work

lgimxye

I really enjoyed this, thanks for sharing!

mr.kachoo

Thank you, they aren't enough videos of people demonstrating !!

nevouxjulie

eu fiquei muito feliz, tentei fazer o reset sozinho, botei lá count = 0 e deu certo, foi o mesmo jeito que vc fez! ok i Will try in english I am very happy because I try to do the reset part alone, and I put count = 0 and the result was the same of you!

pablosantos-bkhy

So sad that onLick doesn't work😭😛

peaklegacy

Thank you very much bro and good luck in this good work, you explain the best and most clearly on all YouTube👌👋❤

nikakuprashvili

That was very good, thank you very much. i like how you explain too.

folgediewahrheit

<*_> This is my seal. I have watched the entire video, understood it, and I can explain it in my own words, thus I have gained knowledge. This is my seal. <_*>

piotrmazgaj

how to recreate NASA database from scratch next ples

Qtaro-oh

Hi, I come from a background where I learned JavaScript as a standalone coding language, without a specific focus on web development. Should I prioritize learning DOM manipulation first to adapt quickly, or are there other aspects I should consider?

badreddineelkalai

you're the best.
let me know now I understand everything but still my problem I can't build the project alone just from ideas using Html &CSS even will I finish JS too, How can I will be the good programmer :( ?

medad

i like how you explain those things bro code

codewhiz.

Hey bro, do you plan to bring a beginner's TypeScript playlist? Cheers.

stadx

Without the humor, dry mono tone oration, and I don't give crap about being politically correct, these are just another coding tut. Love em you never disappoint OnLick :0
It's as if Jamie King's Voice got three octaves higher, added some humor, and spoke at a better cadence.
No slam loved him when he was still posting vids.

Jayeffice

Thanks, bro. You're a real bro 💪

helioobianchi

did you declare the <script> tag before the html contents ??

then let the script tag put buttom after the html tags

hlahtunthein

next can you explain how to build windows form application with C# for begginers please

nikakuprashvili

I did this, it is amazing! But everytime I refresh or close tab, I lose the number where I previously left off. How do I make it such that everytime I refresh, i still get the previously stored number?

DamosyTheFreckle

JavaScript COUNTER PROGRAM 🔢

JavaScript COUNTER PROGRAM 🔢

Counter program in JavaScript ↕️【3 minutes】

Responsive Number Counting Animation | HTML, CSS & Javascript

JavaScript Project: Counter

Simple Counter | Javascript Beginner Project Tutorial

Automatic Counter in Javascript | Automatic increase number in Javascript

Counter Section Using Html Css Javascript Tutorial Coding Forward

Counter App in JavaScript | Project for Beginners | JavaScript Projects

Create a futuristic counter using HTML, CSS & JS | Learn HTML | Learn Web development #coding#ht...

Scroll Activated Number Counter w Javascript | Quick Tutorial

Make a javascript counter using only HTML, CSS And Vanilla js

Counter For HTML & CSS Website | Counter with JavaScript, jQuery

HTML CSS JavaScript Project For Beginners: Counter Program Using HTML CSS JavaScript!

Create Counter Using Javascript | setInterval() in JavaScript | #RuncodeNow #shorts #youtubeshorts

How To Create Counter App using Html Css & Javascript

Animated Counter Using JavaScript With HTML CSS | JavaScript Counter Animation

Counter Program in JavaScript | JavaScript Course for Beginners | #12

Counter | HTML CSS JavaScript

Responsive Counter up Animation on Scroll using HTML CSS & Javascript

How To Make Circular Progress Bar Using HTML CSS JavaScript | Neomorphism Progress Bar

JavaScript Animated. How To Use CountTo - Counter

Counter HTML CSS JavaScript #shorts #html #css

How To Create A Word Counter Using HTML, CSS, & JavaScript

Pure HTML and CSS Number Counter