Cpojer - красивый вид ссылок в коротких и полных новостях

	Cpojer - красивый вид ссылок в коротких и полных новостях
	Представляю Вам хак трансформации ссылок для DataLife Engine. Работает на CSS2.0, хорошо работает на новых браузерах по типу Opera 10, плохо конткачит с IE. Фишка в том, что при наведение на ссылку она анимируется и её фон вертится влево или вправо. Очень красиво будет смотреться в любом дизайне! Установка: 1. В css файл (мы возьмём engine.css) в любое понравившееся вам место(удобней в конец) вписываем: /* Cpojer / .cpojer a { display: inline-block; padding: 4px; outline: 0; color: #587ed7; / ====== Цвет обычного текста / -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 a:hover { background: #587ed7; / ====== Цвет фона при линке / 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 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 end / 2) В файле fullstory.tpl ищите тег {full-story} и заменяете его на: <div class="cpojer">{full-story}</div> 3) В файле shortstory.tpl ищите тег {short-story} и заменяете его на: <div class="cpojer">{short-story}</div> Или говоря нормальным языком подключаем див класс "cpojer" к {full-story} и {short-story}. На этом простейшая установка заканчивается.Смотрится данный хак очень интересно и стильно.Всем советую. Если кого интересует, то демо можно посмотреть на этом сайте fin-newsland.ru*. В любой полной новости, если зарегистрироваться и навести на ссылку,то буквы "пляшут". 2 мая 2011 добавил Arsen 80 1 2 3 4 5
	просмотров 4390 комментариев (1)

	Информация
	Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.