Как убрать у изображения надписи “открыть изображение в новой вкладке” и т.п.?

82
26 апреля 2021, 18:50

У меня есть логотип "VK", при нажатии на который меня перекидывает на мою страничку.

<a href="https://vk.com/my_vk_page" target="_blank"><img src="images/vk-logo.png"></a>

Но проблема в том, что при нажатии правой кнопкой мыши по изображению логотипа этой соц.сети, выскакивают надписи, связанные с тем, что это картинка. Например на других сайтах это выглядит так, будто это просто ссылка. Нет надписей, содержащих информацию о том, что это картинка.

Вопрос: как убрать эти надписи или представить картинку как обычную ссылку?

Answer 1

Есть такое правильно pointer-events: none; которое даёт возможность отключить таргет (взаимодействие) с элементом.
В вашем случае, это свойство, нужно применить к картинке.

a > img {
  pointer-events: none;
}


a { 
  background: black; 
  padding: 5px; 
} 
 
a > img { 
  pointer-events: none; 
}
<a href="#" target="_blank"> 
  <img src="https://vk.com/images/svg_icons/ic_head_logo.svg"> 
</a>

Подробнее о pointer-events

Answer 2

.vk{background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/21/VK.com-logo.svg/500px-VK.com-logo.svg.png) no-repeat;background-size:cover;width:50px;height:50px;overflow:hidden;border:none;cursor: pointer;}
<input class="vk" type="button" value=""  
onclick="location.href = 'https://vk.com'"/>

Answer 3

Сделать это через css background

Вот так вот:

a.vk { 
  background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/21/VK.com-logo.svg/1200px-VK.com-logo.svg.png) no-repeat top center; 
  background-size: 35px 35px; 
  width: 35px; 
  height: 35px; 
  display: inline-block; 
} 
a.vk:hover { 
 opacity: 0.8 
}
<a href="https://vk.com/my_vk_page" class="vk"></a>

READ ALSO
Влияние &lt;!doctype html&gt; на тэг &lt;br&gt;
HTML

Влияние <!doctype html> на тэг <br>

Заметил одну особенностьЕсть нормальная страница с <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4

 93
Unity: сигнал при изменении Toggle
c#

Unity: сигнал при изменении Toggle

У меня есть стандартный ToggleGroupВ нём много Toggle-ов, а один из них выбран

 91
BadImageFormatException
c#

BadImageFormatException

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

 89
GridView.DataSource в DataTable или отделение данных от представления
c#

GridView.DataSource в DataTable или отделение данных от представления

У меня есть дефолтный список людей

 96