调整窗口大小时如何使图像流畅?

海天

调整窗口大小时如何使图像流畅?

我有这样的HTML代码:

<div class="box">
 <img src="http://demo.smooththemes.com/magazon/wp-content/uploads/2013/01/984632486_9d8ff89b63_b-642x336.jpg" />
</div>

和CSS:

.box {width:150px; height:60px; position:relative; overflow:hidden}
.box img{position:absolute; width:180px; height:80px; top:-10px; left:-10px}

调整Windows大小时,我要删除(.box img):的top:-10px; left:-10px属性,并删除more:的属性min-width:100%, max-width:100%这意味着我们有:

.box img{
position:absolute;
width:180px; height:80px; min-width:100%;  
top:(removed); left:(removed)}

如何使用Javascript或Jquery做到这一点。谢谢你的帮助。

斯图尔特·克肖(Stuart Kershaw)

我倾向于同意@Phorden的观点,即媒体查询是一种不错的选择。

但是,如果您需要使用JS / jQuery,请执行以下操作:

$(window).resize(function() {
    $('.box img').css({'top': 'auto', 'left': 'auto', 'min-width': '100%'});
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在JavaFX中调整窗口大小时如何调整图像大小

来自分类Dev

Matlab GUI:调整GUI窗口大小时,调整图像大小(加载到按钮)

来自分类Dev

调整窗口大小时如何实时检测元素高度?

来自分类Dev

调整窗口大小时修改图像大小(jQuery)

来自分类Dev

如何在WPF中调整窗口大小时缩放按钮

来自分类Dev

如何防止导航栏在窗口调整大小时转移?

来自分类Dev

调整窗口大小时如何调整ListView控件的大小

来自分类Dev

如何检测窗口调整大小时的延伸或收缩?

来自分类Dev

调整窗口大小时居中对齐图像css

来自分类Dev

SDL2:调整窗口大小时如何保持宽高比

来自分类Dev

如何在窗口调整大小时覆盖我的数组?

来自分类Dev

调整窗口大小时,图像高度不会调整

来自分类Dev

调整大小时如何防止图像填充整个Tkinter窗口?

来自分类Dev

在调整窗口大小时,如何防止使用HTML-CSS移动图像?

来自分类Dev

ReactJS:调整窗口大小时如何停止屏幕刷新状态?

来自分类Dev

调整窗口大小时图像的位置改变

来自分类Dev

调整窗口大小时如何避免导航栏元素重叠?

来自分类Dev

ReactJS。图像在调整窗口大小时消失

来自分类Dev

调整窗口大小时从CSS顶部的锚图像

来自分类Dev

调整窗口大小时如何调整布局?

来自分类Dev

调整窗口大小时固定图像位置

来自分类Dev

调整窗口大小时如何保持元素居中

来自分类Dev

如何防止导航栏在窗口调整大小时转移?

来自分类Dev

调整窗口大小时如何调整ListView控件的大小

来自分类Dev

调整窗口大小时如何使用鼠标单击获取图像坐标?

来自分类Dev

调整窗口大小时如何保持对象大小相同

来自分类Dev

使用 resizeEvent 调整窗口大小时调整 Qlabel 图像大小

来自分类Dev

HTML/CSS:如何在调整窗口大小时使图像周围的文本适合?

来自分类Dev

调整窗口大小时如何自动调整 JFreeChart 的大小

Related 相关文章

  1. 1

    在JavaFX中调整窗口大小时如何调整图像大小

  2. 2

    Matlab GUI:调整GUI窗口大小时,调整图像大小(加载到按钮)

  3. 3

    调整窗口大小时如何实时检测元素高度?

  4. 4

    调整窗口大小时修改图像大小(jQuery)

  5. 5

    如何在WPF中调整窗口大小时缩放按钮

  6. 6

    如何防止导航栏在窗口调整大小时转移?

  7. 7

    调整窗口大小时如何调整ListView控件的大小

  8. 8

    如何检测窗口调整大小时的延伸或收缩?

  9. 9

    调整窗口大小时居中对齐图像css

  10. 10

    SDL2:调整窗口大小时如何保持宽高比

  11. 11

    如何在窗口调整大小时覆盖我的数组?

  12. 12

    调整窗口大小时,图像高度不会调整

  13. 13

    调整大小时如何防止图像填充整个Tkinter窗口?

  14. 14

    在调整窗口大小时,如何防止使用HTML-CSS移动图像?

  15. 15

    ReactJS:调整窗口大小时如何停止屏幕刷新状态?

  16. 16

    调整窗口大小时图像的位置改变

  17. 17

    调整窗口大小时如何避免导航栏元素重叠?

  18. 18

    ReactJS。图像在调整窗口大小时消失

  19. 19

    调整窗口大小时从CSS顶部的锚图像

  20. 20

    调整窗口大小时如何调整布局?

  21. 21

    调整窗口大小时固定图像位置

  22. 22

    调整窗口大小时如何保持元素居中

  23. 23

    如何防止导航栏在窗口调整大小时转移?

  24. 24

    调整窗口大小时如何调整ListView控件的大小

  25. 25

    调整窗口大小时如何使用鼠标单击获取图像坐标?

  26. 26

    调整窗口大小时如何保持对象大小相同

  27. 27

    使用 resizeEvent 调整窗口大小时调整 Qlabel 图像大小

  28. 28

    HTML/CSS:如何在调整窗口大小时使图像周围的文本适合?

  29. 29

    调整窗口大小时如何自动调整 JFreeChart 的大小

热门标签

归档