https://forumstatic.ru/files/001c/04/0a/76315.css?v=4 https://forumstatic.ru/files/001c/04/0a/84781.css?v=8
wanted wanted wanted
best post

Генерал удивительно органично смотрится распластанным на песке. Райдо, как боец сугубо прагматичный, старается использовать все доступные ему преимущества: держится спиной к солнечной стороне, медлит, не нападает, двигается расслабленно и лениво

EDGEZONE

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » EDGEZONE » DATA LOG » Новая тема, новый znak


Новая тема, новый znak

Сообщений 41 страница 44 из 44

41

блаблабла [hideprofile]

Подпись автора

подпись с картинкой в правом углу
КАРТИНКА

0

42

[html]
<link rel="stylesheet" href="https://forumstatic.ru/files/001c/04/0a/41693.css"/>
    <div class="cp-chat">
  <div class="cp-title-uniq">
  <p>СООБЩЕНИЯ</p><p>></p><p>ЮЗЕРНЕЙМ</p></div>
  <div class="wrap-messages">
  <div class="left-message">Это сообщение оправителя</div>
  <div class="right-message">Это - получателя</div>
  <div class="right-message">Сообщения могут быть любой длины. Вполне хватит, чтобы в три часа ночи писать эссе своим бывшим.</div>
  <div class="cp-date">20 августа 2077</div>
  <div class="left-message">Дата - если нужно указать разницу в несколько дней/недель. Если дата не нужна - просто надо удалить строку с датой. </div>
  <div class="right-message">Можно использовать и картинки
<img  src="https://www.cyberpunk.net/build/images/social-thumbnail-en-ddcf4d23.jpg"></div>
    </div>
  </div>
  [/html]

Подпись автора

подпись с картинкой в правом углу
КАРТИНКА

0

43

[html]<div class='cp-translate' orig-text="ANOTHER TEXT" hover-text="CHANGE TEXT">text text </div>
    <div class='cp-translate' orig-text="ANOTHER TEXT" hover-text="CHANGE TEXT">text text text</div>

<style>
.cp-translate {
font-kerning: none;
  font-feature-settings: "liga" 0;}
</style>

<script>
let divsUniq = document.querySelectorAll(".cp-translate");
let durationUniq = 50;
let framesMax = 7

divsUniq.forEach((div) => {
  let textOrigUniq = div.textContent;
  let interUniq;

  div.addEventListener("mouseover", (e) => {
    let textUniq = div.textContent;
    let charArr = textUniq.split("");
    let frame = 0;

    // shuffle at given speed
    interUniq = setInterval(() => {
      if(frame<framesMax){
        let charArrShuff = shuffleArr(charArr);
        div.textContent = charArrShuff.join("");
        frame++
      }else{
        clearInterval(inter);
        div.textContent = textOrigUniq;
      }
    }, durationUniq);

  });

  // stop
  div.addEventListener("mouseleave", (e) => {
    div.textContent = textOrigUniq;
    clearInterval(interUniq);
  });
});

function shuffleArr(arr) {
  return arr.reduce(
    ([a, b]) => (
      b.push(...a.splice((Math.random() * a.length) | 0, 1)), [a, b]
    ),
    [[...arr], []]
  )[1];
}
</script>[/html]

Подпись автора

подпись с картинкой в правом углу
КАРТИНКА

0

44

[html]
    <li class='cp-translate' data-scramble="ANOTHER TEXT" hover-text="CHANGE TEXT">text text </li>
    <li class='cp-translate' data-scramble="ANOTHER TEXT" hover-text="CHANGE TEXT">text text text</li>
[/html]

[html]
<script>

const randomString = (n, r='') => {
  while (n--) r += String.fromCharCode((r=Math.random()*62|0, r+=r>9?(r<36?55:61):48));
  return r;
};

const unscramble = (el) => {
  const chars = [...el.dataset.scramble];
  const tot = chars.length;
 
  let iteration = 0;
  let ch = 0;
  let solved = "";
 
  el._itv = setInterval(() => {

    if (iteration > 1) {
      iteration = 0;
      solved += chars[ch];
      ch += 1;
    }
   
    el.textContent = randomString(tot - ch, solved);
   
    if (ch === tot) {
      clearInterval(el._itv);
    }
    iteration += 1;
  }, 30);
};

const scramble = (el) => {
  clearInterval(el._itv);
  el.textContent = randomString([...el.dataset.scramble].length)
};

const scrambler = (el) => {
  el.addEventListener("mouseenter", () => unscramble(el));
  el.addEventListener("mouseleave", () => scramble(el));
  scramble(el);
};

document.querySelectorAll("[data-scramble]").forEach(scrambler);

</script>[/html]

Подпись автора

подпись с картинкой в правом углу
КАРТИНКА

0


Вы здесь » EDGEZONE » DATA LOG » Новая тема, новый znak


Рейтинг форумов | Создать форум бесплатно