在页面加载前动态设置CSS img max-height + max-width属性为窗口大小 - Dynamically set CSS img max-height + max-width attribute to window size before page load?

Dynamically set CSS img max-height + max-width attribute to window size before page load?

我只是意识到经过24小时的jquery/javascript痛苦，也许我在这个问题上走错了路。试图将图像的最大宽度和高度设置为等于浏览器的大小(如果它们比浏览器大)，最重要的是，对通过autopager/infinitesscroll加载的图像执行此操作…和tumblr!…太多了。

必须有一种方法来动态设置CSS值。但在我作为业余爱好者编码的这几年里，我从未见过这样的事情，所以我对自己的想法持怀疑态度。

总结一下:当页面加载时，一些脚本检查窗口的高度和宽度，并为所有图像写入css，使其具有浏览器的最大宽度和最大高度。可能吗? !

使用

$(function(){
    var $style = $('<style />').appendTo('head'),
        $window = $(window);
    $window.resize(function(){
        $style.html('img{max-width:' + $window.width() + 'px;max-height:' + $window.height() + 'px}');
    })
    .resize();
});