画像をアスペクト比を保ちながら最大表示【javascript】

htmlで画像を画面いっぱい（要素いっぱい）表示させたいときがある。でも、width: 100%とかcssに書くと高さが画面外に行ってしまうときがある。だから、height: 100%とすると横が画面外にいってしまう。なので、画像の大きさによって切り替わるシステムを作ってみた。jqueryが必要。

$("#img_d").bind("load", function () {
    if ($(this).width() * ($(this).parent().height() / $(this).height()) > $(this).parent().width()) {
    $(this).addClass("w-100");
} else {
    $(this).addClass("h-100");
}
})

そして、cssでw-100にwidth: 100%、h-100にheight: 100%と書いておけば大丈夫。bootstrap使ってたら書かなくても大丈夫。