
Последние записи
- Востановить формулу записанную в ячейке, при записи в ней любого числа и записать это в ячейку другого листа
- Вывод температуры процессора через BAT (CMD)-файл
- Сделать выполнение кода в определенные часы
- OnLine/OffLine на PHP
- ActionScript (Flash) — современные альтернативы и конвертация
- Передача в функцию произвольного набора чисел (на разных языках программирования)
- Joomla 3.8 — Автоматическая авторизация по IP автоматически созданного временного пользователя с принадлежностью к заданной группе
- Конвертация MOV to MP4
- Автоматическое уничтожение объектов
- Найти среднее значение по данным в ячейке

Интенсив по Python: Работа с API и фреймворками 24-26 ИЮНЯ 2022. Знаете Python, но хотите расширить свои навыки?
Slurm подготовили для вас особенный продукт! Оставить заявку по ссылке - https://slurm.club/3MeqNEk

Online-курс Java с оплатой после трудоустройства. Каждый выпускник получает предложение о работе
И зарплату на 30% выше ожидаемой, подробнее на сайте академии, ссылка - ttps://clck.ru/fCrQw
25th
Сен
Плавный переход на jQuery
Posted by obzor under JavaScript
При наведении на объект меняется его бэкграунд. это происходит резко. Нужно сделать этот переход плавным.
$(document).on('mouseover', '.nav-menu .nav-column', function(){
$(this).addClass('active').siblings().removeClass('active')
});
CSS transition криво работает для свойства background-image: при MouseOut в Хроме переход происходит скачком, в FF плавно не происходит вообще. Тогда как для background-color и opacity всё работает отлично (кроме IE младше 10). Можно протестировать в различных браузерах на этой demo.
Можно придумать и другие технологии, но проще всего подкладывать одну картинку под другую и менять opacity, либо делать анимационные эффекты с помощью .animate(), тем более на jQuery у вас подключена.
Вот тут есть идеи и демонстрашки для Cross fading images, в том числе и чистый CSS с подкладыванием одной картинки под другую:
HTML
<div id="cf">
<img class="bottom" src="/images/img.jpg" />
<img class="top" src="/images/img2.jpg" />
</div>
CSS:
#cf {
position:relative;
height:281px;
width:450px;
margin:0 auto;
}
#cf img {
position:absolute;
left:0;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
}
#cf img.top:hover { opacity:0;}
Похожие статьи
Купить рекламу на сайте за 1000 руб
пишите сюда - alarforum@yandex.ru
Да и по любым другим вопросам пишите на почту

пеллетные котлы

Пеллетный котел Emtas

Наши форумы по программированию:
- Форум Web программирование (веб)
- Delphi форумы
- Форумы C (Си)
- Форум .NET Frameworks (точка нет фреймворки)
- Форум Java (джава)
- Форум низкоуровневое программирование
- Форум VBA (вба)
- Форум OpenGL
- Форум DirectX
- Форум CAD проектирование
- Форум по операционным системам
- Форум Software (Софт)
- Форум Hardware (Компьютерное железо)