Vertically center Div with Button using Javascript

Question

http://jsfiddle.net/TN6wW/3/

Trying to get the "Click" button to set the margins of the "mainImage" such that the image will be centered vertically on the page. I'm also trying to avoid jQuery if possible (I've seen jQuery solutions, but I'm a student trying to learn one thing at a time)

My final goal is to figure out how to do what the "click" button is supposed to do, except do it when I click the "next/prev" buttons (and ensure that it uses numbers from the new image and not the current image).

Answer 1

一种常见的技术是使用top：50％，并使用负边缘页边距，该页边距是图像高度的一半： http : //jsfiddle.net/TN6wW/29/