Форум русской поддержки Joomla!® CMS
07.12.2016, 14:41:49 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Затемнение картинки

 (Прочитано 541 раз)
0 Пользователей и 1 Гость смотрят эту тему.
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« : 28.01.2016, 13:26:12 »

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

Нашел вот такой эффект
Показать текстовый блок

Пример работы
Показать текстовый блок

Тут затемняется весь блок, а как сделать чтобы только сама картинка затемнялась ?
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #1 : 28.01.2016, 13:54:57 »

Так?
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #2 : 28.01.2016, 14:01:55 »

нет, тут тоже затемняется весь квадрат а не сама картинка png.
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #3 : 28.01.2016, 14:04:03 »

А в чём принципиальная разница?
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #4 : 28.01.2016, 14:04:49 »

 тут также, как в примере с яблоком, затемняется не само яблоко а полностью картинка, хотя фон прозрачный стоит.  Нужно чтобы при наведении темнело только яблоко а не фон
Записан
LoraDi
Осваиваюсь на форуме
***

Репутация: +2/-0
Offline Offline

Пол: Женский
Сообщений: 26



« Ответ #5 : 28.01.2016, 14:05:05 »

нет, тут тоже затемняется весь квадрат а не сама картинка png.
там как раз затемняется именно картинка... значит Вам нужно по другому... как написали так Вам товарищ Shustry и сделал...
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #6 : 28.01.2016, 14:10:48 »

Вот пример, это вышеуказанный код от Shustry

https://jsfiddle.net/timssky/f44j3233/

Заливается весь квадрат а не само яблоко
« Последнее редактирование: 28.01.2016, 14:17:40 от timssky » Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #7 : 28.01.2016, 14:23:13 »

Вы бы сразу объяснили, что речь про png с альфа-каналом.
Вот
Записан
robert
Профи
********

Репутация: +344/-11
Offline Offline

Пол: Мужской
Сообщений: 3586


« Ответ #8 : 28.01.2016, 14:24:46 »

А что вы хотели? Фон же черный, делайте его прозрачным. Это подойдет?
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #9 : 28.01.2016, 14:32:50 »

Вы бы сразу объяснили, что речь про png с альфа-каналом.
Вот
 
Именно это я и имел ввиду, спасибо Вам !

А можно сделать чтобы при наведении весь контур яблока заливался определенным цветом, например зеленым ?
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #10 : 28.01.2016, 14:37:57 »

Можно.
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #11 : 28.01.2016, 14:41:16 »

не сам контур а все яблоко полностью зеленое по контуру
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #12 : 28.01.2016, 14:47:43 »

Нет.. Можно играть с цветностью или с оттенками всех цветов. Залить конкретным цветом нельзя. Можно в сепию сделать. Это как зелёный, только сепия.
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #13 : 28.01.2016, 14:54:13 »

Хотя, если так. Немного по-хитрому
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #14 : 29.01.2016, 01:33:23 »

Спасибо огромное, а в Internet Explorer он не будет работать ?
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #15 : 29.01.2016, 01:42:07 »

Незачто. С вендорными префиксами в новых. В старых никак и никогда.
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #16 : 29.01.2016, 01:47:07 »

Переделал с префиксами. Проверяйте.
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #17 : 03.02.2016, 20:43:53 »

в  11 explorer не работает
« Последнее редактирование: 07.02.2016, 23:57:39 от timssky » Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #18 : 07.02.2016, 23:57:46 »

 И еще вопрос, а возможно текст вынести в HTML ? потому что у каждой картинки будет свой текст. Не удобно постоянно в CSS лазить
Записан
Shustry
Moderator
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #19 : 08.02.2016, 00:19:21 »

Всё можно. Попробуйте пока самостоятельно. Нет возможности пока переделать. По-первому вопросу гуглите «фильтры ie». По-второму разметку сами можете поменять. Ну или подождите, позже сделаю.
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #20 : 10.02.2016, 13:26:19 »

Подождем
Записан
timssky
Давно я тут
****

Репутация: +0/-0
Offline Offline

Сообщений: 277



« Ответ #21 : 22.02.2016, 08:53:43 »

up
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet