Перейти к содержанию
yanadp

[РЕШЕНО] Увеличение фото при наведении

Рекомендуемые сообщения

Здравствуйте

Установила себе в магазине http://alenka.dp.ua/ увеличение фото при наведении

Сначала не обратила внимание что такая функция не очень удобна, да к тому же коряво работает:(

А теперь не знаю как избавится 

Помогите, пожалуйста

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

В стиле CSS (catalog/view/theme/default/stylesheet/stylesheet.css) найди класс .box-product .image img:hover и удали его)))...

 

там то и стоит увеличение по ховеру (hover)

-webkit-transform: scale(2.5);
-moz-transform: scale(2.5);
-o-transform: scale(2.5);
transform: scale(2.5);

Или используй его)))... например при ховере картинка станет из цветной = черно-белой)))... ну как вариант)))...

.box-product .image img:hover {filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%);}

Изучайте МатЧасть...)))..

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
.product-grid .image img:hover{
position: absolute;
z-index: 1;
-webkit-transform: scale(2.5);
-moz-transform: scale(2.5);
-o-transform: scale(2.5);
transform: scale(2.5);
}

Удалить в stylesheet.css

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
.product-grid .image img:hover{
position: absolute;
z-index: 1;
-webkit-transform: scale(2.5);
-moz-transform: scale(2.5);
-o-transform: scale(2.5);
transform: scale(2.5);
}

Удалить в stylesheet.css

 

 

Да...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

не помогло :( Все равно картинки скачущие какие то
 
Я закрыла эту информацию вот так

/*.product-grid .image img:hover {
position: absolute;
    z-index: 1;    
    -webkit-transform: scale(2.5);
    -moz-transform: scale(2.5);
    -o-transform: scale(2.5);
    transform: scale(2.5);
}*/
/*.box-product .image img:hover {
    position: absolute;
    z-index: 1;    
    -webkit-transform: scale(2.5);
    -moz-transform: scale(2.5);
    -o-transform: scale(2.5);
    transform: scale(2.5);
}*/

Может есть еще какой то способ?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Здравствуйте

Установила себе в магазине http://alenka.dp.ua/ увеличение фото при наведении

Сначала не обратила внимание что такая функция не очень удобна, да к тому же коряво работает :(

А теперь не знаю как избавится 

Помогите, пожалуйста

Попробуйте отключить модуль или что у вас там -  плагин, на добавление водяного знака к изображениям, на 70% уверен - это из-за него, так как полностью удалил ваш stylesheet.css, а глюк остался, уверен - отключите глюканутый водяной знак всё станет на свои места.

Обратил внимание после того как генерируется водяной знак начинает скакать изображение

 

Меню при наведении пляшет 

замените в glossycategory.css на это:

.glossycategory li a:hover, a:active {
background-color: #ffffcb;
color: #0189E1;
font: bold 13px Verdana, Helvetica, sans-serif;
}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

Попробуйте отключить модуль или что у вас там -  плагин, на добавление водяного знака к изображениям, на 70% уверен - это из-за него, так как полностью удалил ваш stylesheet.css, а глюк остался, уверен - отключите глюканутый водяной знак всё станет на свои места.

Обратил внимание после того как генерируется водяной знак начинает скакать изображение

 

Меню при наведении пляшет 

замените в glossycategory.css на это:

.glossycategory li a:hover, a:active {
background-color: #ffffcb;
color: #0189E1;
font: bold 13px Verdana, Helvetica, sans-serif;
}

спасибо. Прыгающее меню поправила (сама как то к нему уже попривыкла и даже не думала менять:))

Водяной знак убрала

Увеличение убралось на первой странице, а в категориях еще есть

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

спасибо. Прыгающее меню поправила (сама как то к нему уже попривыкла и даже не думала менять :))

Водяной знак убрала

Увеличение убралось на первой странице, а в категориях еще есть

Уберите маркеры в футере

#footer .column ul {
margin-top: 0px;
margin-left: 8px;
padding-left: 12px;
list-style: none;
}

да, я оказался не прав, смотрите ява скрипты, которые подключали к сайту, если загрузить сайт без скриптов, то глюк с увеличением пропадает

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.