JavaScript for Gurus

Автор: Ockert J. Du Preez
Год издания: 2020

#javascript #english

Задача

Напишите функцию-конструктор Accumulator(val).

Объект, который она создаёт, должен уметь хранить текущее значение в свойстве value. Начальное значение устанавливается в аргументе конструктора val.
Метод read принимает один параметр (число) и прибавляет его к свойству value.

Ответ

Social Media Icons with Popups

Иконки с всплывающими подсказками, выполненные на чистом CSS, без использования JavaScript.

#html #css #js

Electric strings

Электрический "паук", который следует за движением курсора. Реализован с помощью JavaScript.

#js

Задача

Реализуйте функцию isTwinPrime, которая возвращает true, если:

1. number является простым числом
2. number+2 или number-2 является простым числом.

Если хоть одно условие не выполняется, возвращать false.

Пример:
Возьмем число 7.
1. 7 - простое число.
2. 7+2 = 9, 7-2 = 5. 5 - простое число.
Результат: true

Ответ

​Темная сторона шрифта

Шрифт—это не только дизайн. Современный шрифт—это сложный цифровой продукт, который объединяет данные разных типов. Это и математика описания кривых, и программный код, и инструкции по настройке отображения знаков на экране.

Out-of-Bounds

Генерация теннисных мячиков при клике, выполненная с помощью CSS и библиотек Three.js и Cannon.js

#html #css #js

JavaScript: The Definitive Guide

Автор: David Flanagan
Год издания: 2020

#javascript #english

Directionally aware hover

Эффект hover, который открывается с той стороны, с которой на него навели мышкой. Реализовано без использования JS.

#css #html

​Полезные приемы работы с DevTools

Будучи фронтенд-разработчиком, вы, безусловно, хорошо знакомы с браузером Chrome. Помимо стандартного функционала, этот браузер предоставляет много полезных функций, способных повысить эффективность разработки.

#en

Rubber Slider

range slider с "резиновым" эффектом, реализованный с помощью jQuery, GSAP и TweenMax.js.

#js

Задача

Дана строка, содержащая числительные, представляющие цифры 0-9. Буквы слов перемешаны. Необходимо вернуть цифры в порядке возрастания.

Входные данные: str - строка, содержащая только прописные английские буквы, размер строки от 1 до 10^4. Гарантируется, что строка валидная и содержит представление цифр 0-9.

Выходные данные: строка, содержащая цифры 0-9.

Примеры:
str = “owoztneoer” (т.е. “zeroonetwo”)
Output: “012”
str = “fviefuro” (т.е. “fourfive”)
Output: “45”

Ответ

Practical Node.js

Автор: Azat Mardan
Год издания: 2018

#node #english

JavaScript. Что будет выведено в консоль?

Ответ

Bouncing Ball Checkbox

Анимированный переключатель, выполненный с помощью CSS и библиотеки GSAP.js

#html #css #js

Псевдоклассы :in-range, :out-of-range

Знакомимся с псевдоклассами :in-range и :out-of-range. С их помощью можно стилизовать поля ввода, поддерживающие атрибуты min и max.

#css

​Анимация grid track при помощи :has()

Изучаем возможности :has() для стилизации галереи продуктов.

#css #en

Range Slider

Несколько стилизованных слайдеров на чистом CSS.

#css