Андрей Мотошин Front-end engineer

Скругленные уголки для картинки

#верстка, #javascript, #jQuery

Как известно, свойство border-radius не поможет сделать скругленные уголки для картинок. Небольшой сниппет для решения этой проблемы.

HTML:

<a style="border-radius: 5px;" href="#">
  <img class="b-rounded-img" src="image.jpg" alt="" />
</a>

JS:

$('img.b-rounded-img').each(function(){
  this.style.visibility = 'hidden';
  this.parentNode.style.backgroundImage = 'url(' + this.src + ')';
});