Vorrei provare a fare una cosa tipo questa
http://ringvemedia.com/shanghai
cioè una immagine di sfondo che si ridimensiona a seconda della gradnezza della finestra e che però non si distorca. Vedo che di mezzo c'è anche un js che calcola le dimensioni ma ho visto che funziona lo stesso anche se si disabilitano gli script, quindi dovrebbe essere realizzabile anche solo con css.
Non capisco però bene come funziona anche guardando il codice; ho cercato di riprodurlo ma non mi viene giusto, la cosa più vicina che mi è venuta è questa:

codice:
<style type="text/css">
<!--
#sfondo img{
	height: 100%;
	width: 100%;
	overflow:hidden;
	position:absolute;
}

#sfondo,html, body{
width:100%;
height:100%;
margin:0;
padding:0;
overflow:hidden;
}
-->
</style>
</head>

<body>
<div id="sfondo">[img]barche.jpg[/img]</div>
</body>
</html>
che però si distorce malamente se si restringe ad esempio solo l'altezza della finestra.

Come posso fare?