社区
JavaScript
帖子详情
如何实现当浏览器大小变化时,图片也跟着按比例缩放
loveairsupply
2012-08-22 11:57:19
如题~
补充:图片不是背景图片
...全文
3624
8
打赏
收藏
如何实现当浏览器大小变化时,图片也跟着按比例缩放
如题~ 补充:图片不是背景图片
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
8 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
wbb123yu
2012-11-16
打赏
举报
回复
引用 7 楼 fly1314520929 的回复:
3楼的,图片会变形,4楼的,图片显示不完整,5楼的,不用说了,6楼的呢,那……更不用说!!!
...你的要求还真高 都不符合 你拿着窗口乱拖怎么可能有符合的 你说的按比例是啥比例 窗口长的比还是宽的比 这两个比本来就不一样 你把窗口拉长一条缝 请问你想你的图片显示成啥样?要么不就是显示成一点点 要么不就是显示不全么
fly1314520929
2012-11-16
打赏
举报
回复
3楼的,图片会变形,4楼的,图片显示不完整,5楼的,不用说了,6楼的呢,那……更不用说!!!
btbear
2012-08-23
打赏
举报
回复
三楼 五楼正解、、、
loveairsupply
2012-08-22
打赏
举报
回复
额。。。都快沉了,顶上去
碧海情天-赵亮
2012-08-22
打赏
举报
回复
往往就是很简单的事:
<img src="http://avatar.profile.csdn.net/A/1/0/2_loveairsupply.jpg" width=60%>
gf05011
2012-08-22
打赏
举报
回复
宽度和高度定义为百分比就行
任第一
2012-08-22
打赏
举报
回复
已经测试通过,改成你本地的一张图片就行了。
<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(window).resize(function(){
$("#imgId").height($(window).height());
$("#imgId").width($(window).width());
});
});
</script>
</head>
<body>
<table>
<tr>
<td>
<img id="imgId" src="自己的照片。。。">
</td>
</tr>
</table>
</body>
</html>
MS20HJ
2012-08-22
打赏
举报
回复
在css里面设置那个框框的属性margin:0 auto;
滑轮滚动
图片
跟随放大缩小
滑轮滚动
图片
跟随放大缩小,滑轮滚动
图片
跟随放大缩小
echarts大屏字体自适应的方法步骤
用echarts做大屏可视化的
时
候会遇到不是用电脑投屏而是直接在大屏打开的情况,这
时
候大屏幕下固定的px为单位的字体就会显得很小。有一种解决方法就是采用rem为单位,根据屏幕的宽度调整html的font-size. 获取屏幕宽度并计算
比例
function fontSize(res){ let docEl = document.documentElement, clientWidth = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth; if (!client
vue2
实现
浏览器
大小
变动页面
缩放
功能
在页面html部分获取元素对象(这个一般设置在页面div的第二层)。4.页面具体内容的宽高最好设置。这样按
比例
的属性会导致在不同分辨率下的排版出现问题(比如1920跟1366)。需要
实现
根据
浏览器
大小
变化
从而页面内容同样
缩放
思想
实现
:1.使用css中的。监听方法,监听尺寸
变化
从而调用
缩放
相关方法。这样的具体属性,如果设置。获取操作应该也是一样的。
html中背景
图片
等
比例
缩放
,CSS
实现
响应式全屏背景图+用CSS3
实现
全屏按
比例
缩放
背景
图片
...
该楼层疑似违规已被系统折叠隐藏此楼查看此楼随着逐浪CMS新版的一些效果逐渐放出,有不少的朋友想全屏的背景
图片
如何设计。在不同的
时
代有不同的流行网站显示形式,当前很流行的一种网页形式就是满屏大图,本文将用最简单的方式
实现
该效果。用到了CSS 属性background-size ,无需javascript。先看demo,打开后,调整
浏览器
窗口
大小
,观察背景图的
变化
。如果在你的项目中也需要这样的效果,...
电脑
缩放
、
浏览器
缩放
和前端媒体查询
CSS3媒体查询技术监测的其实是视口尺寸或者窗口尺寸,只要是视口尺寸发生了
变化
就会触发,本质上是一种
浏览器
技术,所以无论是电脑
缩放
或者是
浏览器
缩放
都会导致媒体查询触发。当
浏览器
窗口通过鼠标滚轮拖动改变
大小
的
时
候,视口尺寸和整体窗口尺寸会发生
变化
,屏幕尺寸不会
变化
,这个很好理解在
浏览器
应用内
缩放
,只会等
比例
缩放
浏览器
内的元素尺寸。当电脑
缩放
比发生
变化
时
候,三者的尺寸都会发生
变化
,电脑
缩放
会把逻辑像素等
比例
放大,所以在屏幕硬件不能改变的情况下,屏幕的尺寸px变少了。
JavaScript
87,992
社区成员
224,698
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章