在页面加载前动态设置CSS img max-height + max-width属性为窗口大小
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();
});
相关文章:
- max-height / max-width在Firefox和IE中不起作用
- jQuery if-request max-width(用于媒体查询)
- ng-文件上传验证(ngf-[max|min]-[height|width] 或 ngf 尺寸)似乎没有生效
- 如何读取pseudo-element的height或width属性:在使用Javascript之前
- 带有max-height的奇怪手风琴行为
- 如何使用min/max-height和height为元素应用响应式CSS高度
- 非jquery:获取高度,即使max-height为0
- 在保留宽度的情况下对图像应用max-height
- JavaScript max-width removeAttribute
- Lightbox image max-height =用户屏幕高度
- 在页面加载前动态设置CSS img max-height + max-width属性为窗口大小
- 为什么$(window).width()大于CSS max-width ?
- CSS -如何做一个一次性的CSS表达式在css中?(例如IE的max-height / max-width)
- 图像缩略图,带有max-width和max-height——onmouseover,以某种方式查看更大的图像
- Standardize the full height and width of <input>, <
- Javascript analog of css max-width, max-height 100%
- ngAnimate max-height在某些元素上不起作用
- CSS - max-height不适合打印图像
- 可以根据用户的浏览器设置不同的max-height值吗?
- 使用max-height调整大小后,无法使用Jquery获得图像的宽度