js控制图片缩放 div+css怎么让背景图片自动缩放

JS/CSS控制图片大小自适应按钮的大小 在做网站的时候，往往图片的处理很重要，固定尺寸容易变形拉伸，不固定又会7a64e58685e5aeb931333335303435有不可预知的问题，有可能撑开页面。使用js和css将图片的现实控制在固定的区域内，大于这个区域的等比例缩放，小于这个区域的居中显示。代码：DOCTYPEhtml PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \" http：//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">；html xmlns=\" http：//www.w3.org/1999/xhtml\">；html；charset=utf-8\"/>；css+js完美控制图片大小var flag=false；function DrawImage(ImgD){var image=new Image()；image.src=ImgD.src；if(image.width>；0&image.height>；0){flag=true；if(image.width/image.height>；=400/400){if(image.width>；400){ImgD.width=400；ImgD.height=(image.height*400)/image.width；}else{ImgD.width=image.width；ImgD.height=image.height；}ImgD.alt=image.width+\"x\"+image.height；}else{if(image.height>；400){ImgD.height=400；ImgD.width=(image.width*400)/image.height；}else{ImgD.width=image.width；ImgD.height=image.height；}ImgD.alt=image。.怎么用js实现图片的缩小？ 一般来说，实现图片的放大缩小功能都用到了比较大的封装插件，特别是以jQuery插件居多，而实际上单纯实现对原图本身的放大缩小，用简单几行原生JS代码就可以做到。在今天分享的这个实例中，点击放大按钮不松鼠标，图片会不断的逐渐放大，当然也可以点一下放大一点，点击缩小按钮则反之，有需要的朋友可以考虑收藏备用哦以下为全部代码：html；charset=utf-8\"/>；javascript控制图片缩小或者放大var oTime；function changeSize(id，action){var obj=document.getElementById(id)；obj.style.zoom=parseInt(obj.style.zoom)+(action='+'？10：-10)+'%'；oTime=window.setTimeout('changeSize(\\''+id+'\\'，\\''+action+'\\')'，100)；}document.onmouseup=function(){window.clearTimeout(oTime)；}overflow：auto；('headImg'，'+')；onmouseup=\"window.clearTimeout(oTime)；放大('headImg'，'-')；onmouseup=\"window.clearTimeout(oTime)；缩小div+css怎么让背景图片自动缩放 你指的自动缩放，是根据窗口（容器）大小改变而自动改变背景图的大小么？如果是，请看下面：height：50px；background：url(a.jpg)no-repeat center top；background-size：100%；在body里放一个div，宽度为100%（与浏览器窗口一样宽），然后给div添加背景图，这个窗口大小改变时，div的大小因为设置为100%所以一起改变。这里div的背景图也会随div大小的改变而一起改变，因为为图片设置了background-size：100%；这个css样式，它的意思是规定背景图像的尺寸，但这个css样式使用时需要注意，有些浏览器是不支持的，比如IE要求9+的版本才可以支持。你可以把这段代码拷贝到你的html中测试一下，有问题可以随时追问。以上，希望对你有帮助。JS控制图片放大和缩小怎么改 用js控制图片额大小。主要是修改图片的宽度和高度。下面是简单的代码实现：HTML 代码：这个时候img的图片自身是多大，就会显示多大。100px*100px的图。js代码：var oImg=document.getElementById('img')；oImg.width='50px'；当给img标签的宽度设置为50px后，高度会自动按比例缩小。oImg.width='200px'/当给img标签的宽度设置为200px后，高度会自动按比例扩大。JS怎么控制图片按照比例缩放 有办法，只是IE6等比例缩放无效 因为这要使用max-width属性2个问题自动缩放 可以通过max-width和max-height来实现垂直居中，给你一个思路，对于2个inline-block元素同时使用vertical-align：middle能够产生意想不到的效果，IE7可以通过zoom来模仿inline-block自己动手去写一下吧，你就会明白js控制图片显示宽度和高度 你让图片根据高度等比例缩放 可以让宽度auto。这样图片就等比例缩放了。javascript高手请进！关于就js控制网页图片放大缩小的问题 这个代码只是修改了缩放元素的缩放比例，并没有设置基准点。基准点应该是这个元素的定位属性导致的吧，比如img{position：absolute；top：0；right：0；}也许是其中的定位导致了基准点在右上的效果

#js代码#控制图#js#自适应#css