Wenn Du nicht auf einer Javascript-Lösung bestehst, könntest Du in Html einen "Wrapper" für das Bild erstellen, der 80% des Anzeigebereiches einnimmt. Das Bild und die Navigationsleiste erhalten jeweils 100% des zur Verfügung stehenden Raumes, d.h. 100% des Wrappers bzw. 80% des Anzeigebereiches. Die Höhe des Bildes erhält per Css den Wert "auto, sodass die Proportionen des Bildes erhalten bleiben. Das Bild wird zudem über "display:block" zu einem Blockelement umformatiert ...

die Breite des divs würde sich dann vermutlich an dem Objekt orientieren, das am meisten Platz braucht. Also wenn das Bild groß genug ist, passt sich die Linkleiste genau ein, wenn zuwenig Platz für sie ist, ragt sie aus dem Bildrand heraus, bleibt dafür aber lesbar.
So weit richtig? Ich probier das gleich mal..
Dank und Gruß