1. Главная
  2. Форумы
  3. Техподдержка Drupal
  4. FAQ

Классный наезд на фото

Главные вкладки

Комментарии

Аватар пользователя Jean-Claude Jean-Claude 8 апреля 2013 в 20:55

по моему это чистый css 3.0, при чем тут изотоп, ну хоть немножко думайте головой.

.option ol li a:first-child {
    position: relative;
}

.option ol li a:first-child:hover .bg-transparent {
    transform: scale(1);
    visibility: visible;
}

.option ol li a:first-child .bg-transparent {
    background: url("images/bg-transparent.png") repeat scroll 0 0px, url("images/hover-link.png") no-repeat scroll center center transparent;
    display: block;
    height: 100%;
    left: 0;
    outline: medium none;
    position: absolute;
    text-align: center;
    text-indent: -999em;
    top: 0;
    transform: scale(0);
    transition: all 300ms ease-in-out 0s;
    visibility: hidden;
    width: 100%;
}

Аватар пользователя DD 85 DD 85 8 апреля 2013 в 3:30

"Заводской раб" wrote:
по моему это чистый css 3.0? при чем тут изотоп, ну хоть немножко думайте головой.

Ну хоть немножко по ссылкам кликайте. И думайте другой головой.

Аватар пользователя Dan Dan 8 апреля 2013 в 8:49

"DD 85" wrote:
Ну хоть немножко по ссылкам кликайте. И думайте другой головой.

А что же это, если не CSS3, если оно без JS работает?
Вы сами-то по ссылкам свои покликайте и посмотрите код.

Аватар пользователя DD 85 DD 85 8 апреля 2013 в 13:23

Я ol и li в коде не вижу.
Тогда уж

.mt-mask {
    border: 3px solid #FFFFFF;
    box-shadow: 0 0 15px #C0C0C0;
    display: block;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: scale(0);
    transition: all 0.4s ease-in-out 0s;
    z-index: 999;
}

.products-grid .product-image:hover .mt-mask,
.products-grid .mask:hover .mt-mask,
.related-product-grid .product-image:hover .mt-mask,
.mt_productscroller .product-image:hover .mt-mask {
    opacity: 1;
    transform: scale(1);
}

.mt-mask .mt-mask-top {
    background: url("../images/bg-tranfer-mask.png") repeat scroll 0 0 transparent;
    height: 300px;
    position: relative;
}

Аватар пользователя Jean-Claude Jean-Claude 8 апреля 2013 в 21:00

"DD 85" wrote:
Ну хоть немножко по ссылкам кликайте. И думайте другой головой.

человек спросил - при наведении мышки на фото - что за эффект.. Переходим по ссылке предоставленной топикстартером, там как раз какой-то эффект при наведении мышки на фото, разве не логично что топикстартер спрашивал про этот эффект?

при чем тут клацать по ссылкам? ну хоть головой думайте немножко.

Аватар пользователя DD 85 DD 85 8 апреля 2013 в 22:06

"Заводской раб" wrote:
разве не логично что топикстартер спрашивал про этот эффект?

"edward_dz" wrote:
появления доп. информации

Ладно, простите если что не так. Автор топика дал ссылку на страницу со спецэффектами – если перейти по ссылке на этой странице, то ссылка не меняется. Не увидев появления никакой дополнительной информации, я понял, что надо перейти на одну из трёх страниц. И что речь идёт о товарах выводимых вьюсом. Который для вывода использует выше указанный модуль ну и CSS конечно. Ещё раз простите, что дал автору топика чуть больше информации по его страницам. Заводской раб, заладив про голову и не обратив внимания на “появления доп. информации” получается, дал CSS вообще не той страницы. А автор топика молчит и, по-моему, меньше нас всех над этим парится.

Аватар пользователя Jean-Claude Jean-Claude 8 апреля 2013 в 22:08

ну так даже в магазине эффект сделан при помощи CSS, за сетку точно никто не спрашивал

ёлки-палы, михал михалыч.

Аватар пользователя edward_dz edward_dz 9 апреля 2013 в 8:53

Молчу, потому что все-равно не понятно.
Что именно нужно сделать, чтобы при наведении мышкой на изображение включалась полупрозрачность и появлялся текст с доп. информацией?

Аватар пользователя multpix multpix 9 апреля 2013 в 9:36

"edward_dz" wrote:

Молчу, потому что все-равно не понятно.
Что именно нужно сделать

Учить те технологии, которые решил использовать.