- ЛентаВторник 10.03.2026 04:24
in.uCoz.org - создан в помощь uCмастеру и служит для решения проблем возникших у пользователей администрирующих сайты системы uCoz. Все вопросы пишите на форуме в соответствующий раздел
ПопулярноеАвтор: Prosvetekvator
Автор: Prosvetekvator
Автор: Prosvetekvator
Автор: Prosvetekvator
Автор: ProsvetekvatorНаш опросСлучайный анекдот97 Студия фильмов для взрослых объявила кастинг на главную мужскую роль. Собрались жеребцы, красуются. В итоге выбирают парня под два метра рост, мускулатура что надо, достоинство по колено... в течение часа выбирают актёра на функции дублера и заканчивают. Сидят, выпивают члены комиссии, включая режиссера, сценариста, главного спонсора и т.д. Тут заходит маленький, лысый, пузатый мужик и спрашивает: - Здесь кастинг? - Да, а тебе чего? - слышит в ответ. - Как чего? Участвовать хочу!!! К нему подходит режиссер и показывает фотки парня, отобранного на главную роль и спрашивает: - Видишь какой красавчик? А на себя ты смотрел в зеркало? Тот, почесав лысину, говорит: - ДАААА, хороший парень... а что - отрицательный герой не нужен?СтатистикаОнлайн всего: 1Гостей: 1Пользователей: 0
» Сегодня нас посетили:» Зарег. на сайте
Всего: 3497
Новых за месяц: 1
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
» Из них
Администраторов: 1
Модераторов: 3
С активностью: 177
Авторизованных: 3316Трансформация ссылок с помощью CSS
Сегодня научимся создавать эффект трансформации ссылок при наведении на них, при помощи css. Идеально подойдет для меню категорий и прочих ссылок.
Установка:
Устанавливаем в css
Код.cpojer-links a {
display: inline-block;
padding: 4px;
outline: 0;
color: #3a599d;
-webkit-transition-duration: 0.25s;
-moz-transition-duration: 0.25s;
-o-transition-duration: 0.25s;
transition-duration: 0.25s;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
-webkit-transform: scale(1) rotate(0);
-moz-transform: scale(1) rotate(0);
-o-transform: scale(1) rotate(0);
transform: scale(1) rotate(0);
}
.cpojer-links a:hover {
background: #3a599d;
text-decoration: none;
color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-transform: scale(1.05) rotate(-1deg);
-moz-transform: scale(1.05) rotate(-1deg);
-o-transform: scale(1.05) rotate(-1deg);
transform: scale(1.05) rotate(-1deg);
}
.cpojer-links a:nth-child(2n):hover {
-webkit-transform: scale(1.05) rotate(1deg);
-moz-transform: scale(1.05) rotate(1deg);
-o-transform: scale(1.05) rotate(1deg);
transform: scale(1.05) rotate(1deg);
}
Теперь всем ссылкам придаем класс cpojer-links, как показано на примере ниже
Код
<div class="cpojer-links">
<a href="http://in.ucoz.org/">in.uСoz.org</a><br>
<a href="http://in.ucoz.org/news/">Скрипты - in.uСoz.org</a>
</div>
Html редактор
Вставте код в поле и нажмите проверить.
Не забывайте указывать путь к файлам и картинкам в скриптах!!!Просмотров: 953723.06.2013
Другие статьи почитайка;)
Поделись ссылкой на форумах
Ссылка: BB-code: HTML:
« Пред. Трансформация ссылок с помощью CSS След. »
Форма входаМини-чатТоп пользователейProsvetekvator 190 startsmart 72 DoG 24 Reactor 10 HACKER 6 Алена 2 na3uTuB4uk 1 Diz24 1 creat1vex 1 haCker8055 1 Новое на форуме
Комментарии11.06.2022
02.04.2020
Может это по тому, что редактировали скрипт? 