How to calculate image height dynamically at hover effect in CSS?

Question

My need is to calculate an image height value dynamically at the hover effect when using transform: translateY( ). As I did at hove I use transform: translateY( -80% ) this -80% value needs to come dynamically from images height according to those individual images & of course, these images heights are different from each other, (in short, all images heights are not the same).

So instead of using this static -80% hard-coded value, want to use variable images height at hover effect to respect those individual images height.

.image {
    height    : 30rem;
    width     : 40rem;
    overflow  : hidden;
}

.image:hover  img {
    transform : translateY(-80%); 
   /* this -80% value should be dynamic, base on img height value */
}

img {
    width     : 100%;
    transition: 5s ease;
}