0 Пользователей и 1 Гость просматривают эту тему.
  • 5 Ответов
  • 685 Просмотров
*

suic

  • Осваиваюсь на форуме
  • 23
  • 1 / 0
Собственно, как реализовать, люди добрые? Нужно при наведении на плитку, чтобы вся она стала ссылкой.

Вот, что есть:  https://codepen.io/awbo/pen/zYvxZgW
*

draff

  • Гуру
  • 5365
  • 381 / 7
  • ищу работу
*

suic

  • Осваиваюсь на форуме
  • 23
  • 1 / 0
Re: Div с картинкой и текстом как ссылка
« Ответ #2 : 11.04.2020, 09:07:04 »
Код
.item{ cursor:pointer; }
Поменялся курсор при наведении, а где ссылку прописать?
*

draff

  • Гуру
  • 5365
  • 381 / 7
  • ищу работу
Re: Div с картинкой и текстом как ссылка
« Ответ #3 : 11.04.2020, 10:01:20 »
При наведении через JavaScript. Или в структуре, но валидатор будет ругаться
Код
<a href="#" ><div class="item"></div></a>
*

fbr

  • Завсегдатай
  • 1540
  • 178 / 7
Re: Div с картинкой и текстом как ссылка
« Ответ #4 : 11.04.2020, 10:22:12 »
Если правильно понял. Можно использовать такую конструкцию:
Код
<div class="item">
<img ... />
<a ...></a>
</div>

ссылку делаем абсолютной и ширина=высота=100%
Код
.item {position: relative;}
.item a {
position:absolute;
left:0;
top:0;
width:100%;
height: 100%;
}
*

suic

  • Осваиваюсь на форуме
  • 23
  • 1 / 0
Re: Div с картинкой и текстом как ссылка
« Ответ #5 : 11.04.2020, 12:47:15 »
спасибо.
решил вот так сделать:

Код
<div class="item"><a href="###"><img src="http://cooltermo.ru/images/912.jpg">Заправка автокондиционеров</a></div>
Изображение и текст как ссылка.

Код
.item a {
  display:block;
  height:100%;
}
и стиль ссылки block.

не идеально, но 90% плитки превратилось в ссылку :)

Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как сделать заголовок под картинкой?

Автор seryoga_1985

Ответов: 2
Просмотров: 673
Последний ответ 26.01.2016, 18:20:47
от seryoga_1985
Обтекание текстом видео

Автор HTR

Ответов: 4
Просмотров: 1193
Последний ответ 26.11.2015, 09:51:23
от HTR
Меню Joomla 3.4.5 с svg картинкой

Автор Alex GOOD

Ответов: 3
Просмотров: 979
Последний ответ 28.10.2015, 23:26:01
от Shustry
Обтекание картинки текстом и выравнивание блока картинок

Автор zigzagrus

Ответов: 5
Просмотров: 1089
Последний ответ 01.08.2015, 14:08:02
от zigzagrus
Замена фона за текстом

Автор Aleks80

Ответов: 3
Просмотров: 961
Последний ответ 15.12.2014, 12:55:37
от Aleks80