Новосибирск +7(383)

По всем вопросам :

Пример хорошей анимации меню на css

 

CSS стили:

panel { padding-left: 1px; width:192px; list-style:none; padding-top:1px; display:inline-block; } #panel li { background: url("/img/userimages/user_781/back.jpg") repeat scroll 0 0 rgba(0, 0, 0, 0); border: 1px dotted silver; color: #8d8c8b; margin-top: 1px; text-align: left; width: 195px; } #panel li a { color:#fff; display:block; padding: 9px 8px; } #panel li a:hover { color:#fff; } #panel li.animation {-moz-transition: all 0.3s ease-in-out 0s; -moz-transform:translateX(0px); -o-transition: all 0.3s ease-in-out 0s; -o-transform:translateX(0px); -webkit-transition: all 0.3s ease-in-out 0s; -webkit-transform:translateX(0px); } #panel li a.active{ color:#fff; } #panel li.animation { -moz-transition: all 0.3s ease-in-out 0s; -moz-transform:translateX(0px); -o-transition: all 0.3s ease-in-out 0s; -o-transform:translateX(0px); -webkit-transition: all 0.3s ease-in-out 0s; -webkit-transform:translateX(0px); } #panel li.animation:hover { color: aqua; background: #6a6869; -moz-transform:translateX(10px); -o-transform:translateX(10px); -webkit-transform:translateX(10px); -moz-transition: all 0.5s ease-in-out 0s; -o-transition: all 0.5s ease-in-out 0s; -webkit-transition: all 0.5s ease-in-out 0s; }

 

HTML:

<ul id="panel">
<li class="animation"><a>Постельное белье</a></li>
<li class="animation"><a>Покрывала</a></li>
<li class="animation"><a>Одеяла</a></li>
<li class="animation"><a>Полотенца</a></li>
</ul>

Как с нами связаться

По всем вопросам пишите  

OnLine заказ

Отправить сообщение

Нажимая на кнопку «Отправить сообщение», я соглашаюсь:
* с условиями публичной оферты
* обработку моих персональных данных


RAD компоненты

  • Точный рейтинг материалов k2


    Стоимость 500

  • Статистика К2 (Joomla 3x)


    Стоимость 1500

  • Экспорт в яндекс маркет YML формат


    Стоимость 1000

  • Акции К2 store


    Стоимость 1200

  • QR code в K2 и k2_store


    Стоимость 300

  • Мониторинг здоровья


    Стоимость 700

  • Модуль отзывов - яндекс маркет, фламп


    Стоимость 500

  • Таблица замены текста по тегу


    Стоимость 700

  • ЖКХ паспорт дома


    Стоимость 5000

  • Плагин обновления доп.поля К2


    Стоимость 200

  • K2_store купоны


    Стоимость 1500

  • K2_store сопутствующий товар


    Стоимость 1000

  • Плагин Scroll to Top Mobile Detect


    Стоимость 500

  • Водяной знак, торговая марка


    Стоимость 1500

  • JShopping поиск товара по атрибутам


    Стоимость 1000

  • Расписание занятий


    Стоимость 1500

  • Плагин оплаты K2 store Форма ПД-4 Сбербанк


    Стоимость 700

  • Доска объявлений


    Стоимость 1500

  • Расширенные заказы JoomShopping


    Стоимость 2500

  • Галерея изображений


    Стоимость 1000

  • Калькулятор прибыли


    Стоимость 500

  • Назначение группы пользователя от суммы заказа VM3


    Стоимость 1200

  • Автоматические купоны по сумме заказов VM3


    Стоимость 1200

Please publish modules in offcanvas position.