Как сделать эффект затемнения фона при наведении на картинку?
1 строчкаimg:hover {
box-shadow: 0 0 0 99999px rgba(0, 0, 0, 0.8);
}
Реализация: codepen.io/anon/pen/KrQENE
Возможно, потребуется еще z-index, в зависимости от того, что у Вас еще в макете творится.
можно что-то такое$('img').each(function () {
                $(this).hover(
                    function () {
                        $(this).css('z-index', 99999);
                        $('body').addClass('hover_img');
                    },
                    function () {
                        $(this).css('z-index', 1);
                        $('body').removeClass('hover_img');
                    });
            });

body.hover_img{
  position: relative;
  &:before{
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    z-index: 99998;
  }
}
img{
  position: relative;
}