Как сделать, что бы картинки были в центре своего DIV блока?

Question

[Demigodd]

https://jsfiddle.net/8x63gpLv/

есть картинки в .head-content → .cv-image div`e
Как сделать что бы картинки которые находятся в .cv-image
были в самом центре этого блока. И при прокрутке не сходили с места, то есть были фиксированными.

Answer 1

[Aleksey Solovyev]

https://jsfiddle.net/8x63gpLv/19/

.cv-image {
  position: relative
}
.img1,
.img2 {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

Удалить свойства left top на строках 59-60 и 65-66

update
не заметил про прокрутку

const el = document.getElementById('image');
const divOffset = offset(el);
window.onscroll = stay;
function stay() {
  var scrollTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
  el.style.top = divOffset.top + scrollTop + 'px'

}

function offset(el) {
    var rect = el.getBoundingClientRect(),
    scrollLeft = window.pageXOffset || document.documentElement.scrollLeft,
    scrollTop = window.pageYOffset || document.documentElement.scrollTop;
    return { top: rect.top + scrollTop, left: rect.left + scrollLeft }
}