WebTaverna /> js, css, html @webtaverna Channel on Telegram

WebTaverna /> js, css, html

21 Nov, 20:08

0️⃣

Math.random() в JavaScript возвращает псевдослучайное число с плавающей запятой в диапазоне от 0 до 1, не включая 1

В дальнейшем это число можно «отмасштабировать», привести к нужному диапазону.

const value = Math.random()

// Каждый раз будет получать случайное число 
console.log(value)
// 0.8526006877925647

⚠️ На самом деле Math.random() не генерирует случайные числа. Это лишь иллюзия 🙌 . Случайные числа генерируются на основе алгоритма, который можно просчитать. Поэтому данный метод не подходит там, где речь идет о безопасности. Для таких целей стоит использовать Web Crypto API и его методы getRandomValues() и generateKey()

👉 jsProger | #объект_Math

365

WebTaverna /> js, css, html

21 Nov, 16:22

Обрезаем длинный текст с красивым эффектом затухания

Для начала, мы зададим тегу h1 overflow: hidden, чтобы текст обрезался и white-space: nowrap, чтобы он не переносился на новую строку.

А далее, чтобы создать сам эффект затухания, мы добавим поверх него псевдоэлемент и зададим ему линейный градиент слева направо

HTML разметка

<h1>Канал WebTaverna /> JavaScript</h1>

CSS стили

h1 {
  position: relative;
  width: 220px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: clip;
}
h1::after {
  content: "";
  position: absolute;
  right: 0;
  height: 100%;
  width: 120px;
  background-image: linear-gradient(to right, transparent, #fff);
}