如何根据高度调整图像大小，并使其响应

Question

我希望在所有平台和所有分辨率的网络上制作可扩展的图像。谷歌这样做的方式让我印象深刻。例如：

1900 - https://lh3.googleusercontent.com/-9xyCVGjVJjE/AAAAAAAAAAI/AAAAAAAAAG0/a4jFEtQ3ziY/s1900-c-k-no/photo.jpg

190 - https://lh3.googleusercontent.com/-9xyCVGjVJjE/AAAAAAAAAAI/AAAAAAAAAG0/a4jFEtQ3ziY/s190-c-k-no/photo.jpg

网上有很多资源可以显示如何根据屏幕尺寸调整图片大小，但没有任何资源可以接近google plus。我得到了一些相同问题的链接

Google Script Image Resizing，

Resize image like google，

http://www.quora.com/Google+/How-google-resize-images-dynamically-based-on-screen-size

但以上都没有解决我的问题。我能够重新调整图像大小但不能像谷歌一样使其响应。

我对jquery，javascript，php有所了解。我相信它与php gd库和jquery有关，或者可能通过css媒体查询，但无法解决问题。在提出问题之前，我尝试了以下资源：

1. http://adaptive-images.com/ - 无法根据高度调整图像大小。它在宽度方面可以很好地扩展。

2. http://boxresizer.com/

3. Timthumb：http://www.binarymoon.co.uk/projects/timthumb/，http://www.darrenhoyt.com/2008/04/02/timthumb-php-script-released/ - 这不适合身高。

4. 服务器端图像缩放器：http://css-tricks.com/snippets/php/server-side-image-resizer/

5. 基于Css的大小调整：http://blog.kurtschindler.net/post/flexible-dynamically-resizing-images-with-css

有人可以建议我解决问题或帮我根据上述资源对问题进行排序。

Answer 1

Ethan Marcott的解决方案就在这里。

http://unstoppablerobotninja.com/entry/fluid-images/

他是第一个使用“响应式网页设计”一词的人。希望它能解决你的问题。无论如何，这个年龄的问题很好。