+ Ответить в теме
Показано с 1 по 3 из 3

Тема: Странный баг, hover + outline + translateY()

  1. #1
    Новичок Eternal на пути к лучшему Аватар для Eternal
    Регистрация
    13.10.2018
    Сообщений
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Странный баг, hover + outline + translateY()

    В общем, потребовалось сделать на :hover() подпрыгивание блока и обводку. Border со свойством transparent немного портил картину, поэтому решил попробовать outline. И я заметил странный баг, при наведении на самый низ блока он начинает прыгать вверх-вниз. Даже интересно, в чем проблема.Пытался гуглить, ничего по этому вопросу не нашел. https://codepen.io/AryanPride/pen/dgzKQE

  2. #2
    Местный Degradator скоро придёт к известности Аватар для Degradator
    Регистрация
    02.07.2012
    Сообщений
    1,925
    Thanks
    141
    Thanked 143 Times in 143 Posts
    Алгоритм такой -
    при наведении на блок, ты задаешь transform:translateY(-15px);
    блок смещается на 15 пикселей вверх
    Мышка теперь находится ниже блока, и эффект hover пропадает
    Сразу после этого блок возвращается на первоначальное место
    как только он возвращается, то срабатывает эффект hover, поскольку мышка снова над ним
    Получается что блок прыгает

  3. #3
    Новичок Eternal на пути к лучшему Аватар для Eternal
    Регистрация
    13.10.2018
    Сообщений
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Тоже так сначала подумал, но с border всё работало нормально. А сейчас попробовал с 0 это реализовать, в итоге с border тоже прыгает.Видимо как-то сказываются подключенные на сайте стили.

+ Ответить в теме

Похожие темы

  1. Странный баг на вкладках
    от kkolorid в разделе HTML
    Ответов: 0
    Последнее сообщение: 08.12.2014, 16:56
  2. Странный ответ в сортировке
    от Den1xxx в разделе Базы данных
    Ответов: 3
    Последнее сообщение: 24.11.2014, 11:15
  3. Что за странный вирус?
    от bcom в разделе Флейм и оффтопик
    Ответов: 10
    Последнее сообщение: 09.08.2012, 10:53
  4. Странный Баг.
    от Чафк в разделе HTML
    Ответов: 0
    Последнее сообщение: 08.02.2012, 15:06
  5. Странный баг
    от Winlook в разделе PHP
    Ответов: 2
    Последнее сообщение: 12.03.2010, 21:37

Метки этой темы

Социальные закладки

Социальные закладки

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения