Size: a a a

JavaScript Noobs — сообщество новичков

2021 February 21

F

Future in JavaScript Noobs — сообщество новичков
посредине страницы есть некоторый каунтер, который в реальном времени от 0 до N просчитывает за пару секунду, анимация типа.
как мне сделать, чтобы он начинал это делать когда именно туда доскролили а не когда загрузилась страница?
источник

IK

Igor Kim in JavaScript Noobs — сообщество новичков
Ребят, вы же гении все?
источник

IK

Igor Kim in JavaScript Noobs — сообщество новичков
Кто умеет играть в сапёр?
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
Future
посредине страницы есть некоторый каунтер, который в реальном времени от 0 до N просчитывает за пару секунду, анимация типа.
как мне сделать, чтобы он начинал это делать когда именно туда доскролили а не когда загрузилась страница?
Там, на какой высоте начинается анимация запускать ее? scrollTop, getBoundingClientRect глянь
источник

AA

Andrey Androsov in JavaScript Noobs — сообщество новичков
Igor Kim
Кто умеет играть в сапёр?
мой батя
источник

F

Future in JavaScript Noobs — сообщество новичков
Илья Дёмин
Там, на какой высоте начинается анимация запускать ее? scrollTop, getBoundingClientRect глянь
на разной может быть ведь, если мобильный, то другая. думал может можно ивент какой-то можно навесить типа onShow
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
Future
на разной может быть ведь, если мобильный, то другая. думал может можно ивент какой-то можно навесить типа onShow
function elementInViewport2(el) {
 var top = el.offsetTop;
 var left = el.offsetLeft;
 var width = el.offsetWidth;
 var height = el.offsetHeight;

 while(el.offsetParent) {
   el = el.offsetParent;
   top += el.offsetTop;
   left += el.offsetLeft;
 }

 return (
   top < (window.pageYOffset + window.innerHeight) &&
   left < (window.pageXOffset + window.innerWidth) &&
   (top + height) > window.pageYOffset &&
   (left + width) > window.pageXOffset
 );
}
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
вот тебе onShow грубо говоря, если твой элемент в окне вьюпорта запускай анимацию
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
Можно слушатель поставить на скролл и проверять
источник

ab

a b in JavaScript Noobs — сообщество новичков
IntersectionObserver
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
a b
IntersectionObserver
тема, не знал, что такое есть)
источник

EK

Eugene Kartashian in JavaScript Noobs — сообщество новичков
button.onclick = function() {
   let val1 = document.getElementById('firstName').value;
   document.getElementById('popup').innerHTML="First name: " + val1;
   let val2 = document.getElementById('lastName').value;
   document.getElementById('popup').innerHTML="Last name: " + val2;
};

Подскажите как это переписать, чтобы оба значения отображалось при клике
источник

IE

Igor' Ember in JavaScript Noobs — сообщество новичков
Как можно оценить сколько canvas элемент жрёт оперативной памяти? Ну или какую-то оценку получить, чтобы понять, какую нагрузку оно создаёт
источник

OJ

Oleg Junior in JavaScript Noobs — сообщество новичков
Привет. Какие паттерны проектирования наиболее часто применяются во фронтенд разработке? Что учить в первую очередь?
источник

IE

Igor' Ember in JavaScript Noobs — сообщество новичков
Oleg Junior
Привет. Какие паттерны проектирования наиболее часто применяются во фронтенд разработке? Что учить в первую очередь?
синглтон
источник

IE

Igor' Ember in JavaScript Noobs — сообщество новичков
только его, остальные ненужно
источник

B

Bohdan in JavaScript Noobs — сообщество новичков
Igor' Ember
Как можно оценить сколько canvas элемент жрёт оперативной памяти? Ну или какую-то оценку получить, чтобы понять, какую нагрузку оно создаёт
в девтулс есть что-то такое
источник

А

А_Greece 🌸 in JavaScript Noobs — сообщество новичков
Igor' Ember
Как можно оценить сколько canvas элемент жрёт оперативной памяти? Ну или какую-то оценку получить, чтобы понять, какую нагрузку оно создаёт
Вкладка Performance
источник

F

Future in JavaScript Noobs — сообщество новичков
Илья Дёмин
function elementInViewport2(el) {
 var top = el.offsetTop;
 var left = el.offsetLeft;
 var width = el.offsetWidth;
 var height = el.offsetHeight;

 while(el.offsetParent) {
   el = el.offsetParent;
   top += el.offsetTop;
   left += el.offsetLeft;
 }

 return (
   top < (window.pageYOffset + window.innerHeight) &&
   left < (window.pageXOffset + window.innerWidth) &&
   (top + height) > window.pageYOffset &&
   (left + width) > window.pageXOffset
 );
}
спасибо, попробуем)
источник

ИД

Илья Дёмин in JavaScript Noobs — сообщество новичков
Future
спасибо, попробуем)
IntersectionObserver вот еще человек написал, можешь почитать про этот API
источник