1var element = document.getElementById("#id");
2element.addEventListener('click', function(){
3 console.log("click");
4});
1document.getElementById("example").addEventListener('click', function() {
2 alert('Click');
3});
1const element = document.querySelector(".class__name");
2
3element.addEventListener("click", () => {
4 console.log("clicked element");
5});
1let = buttonRoll = document.getElementById("myButton")
2buttonRoll.addEventListener("click", function(){
3 console.log("Button Clicked")
4})
5
1<body style="height: 5000px">
2 <style>
3 body, /* blink currently has bug that requires declaration on `body` */
4 html {
5 scroll-snap-type: y proximity;
6 }
7 .snaptarget {
8 scroll-snap-align: start;
9 position: relative;
10 top: 200px;
11 height: 200px;
12 background-color: green;
13 }
14 </style>
15 <div class="snaptarget"></div>
16</body>
1<body style="height: 5000px">
2 <script>
3 function snap(destination) {
4 if (Math.abs(destination - window.scrollY) < 3) {
5 scrollTo(window.scrollX, destination);
6 } else if (Math.abs(destination - window.scrollY) < 200) {
7 scrollTo(window.scrollX, window.scrollY + ((destination - window.scrollY) / 2));
8 setTimeout(snap, 20, destination);
9 }
10 }
11 var timeoutId = null;
12 addEventListener("scroll", function() {
13 if (timeoutId) clearTimeout(timeoutId);
14 timeoutId = setTimeout(snap, 200, parseInt(document.getElementById('snaptarget').style.top));
15 }, true);
16 </script>
17 <div id="snaptarget" class="snaptarget" style="position: relative; top: 200px; width: 100%; height: 200px; background-color: green"></div>
18</body>