想用JS做一个使图片变模糊的效果,求教!

JavaScript013

想用JS做一个使图片变模糊的效果,求教!,第1张

看你想要实现的环境了, 有一个方法是这样的,可以用CSS实现 , 在最新的浏览器里支持, 如chrome, safari, 就是 webkit内核的浏览器里 css 的 blur 可实现, 把图片模糊了。

如果你是想在ipad上的应该, 完全就可以用这种方法了。

图片预加载 *{ padding:0margin:0} #box{ width:620pxmargin:0 auto} li{ width:300pxheight:300pxoverflow:hiddenfloat:leftmargin:0px 0 0 10pxbackground:url(1.gif) no-repeat center} li img{display:nonewidth:300pxheight:300px} var arr=["http://q.chinasspp.com/uploadimg/ZoneOtherPic/2007121113466235.jpg","http://www.baobaolo.com/LackPic/lack989.jpg","http://pic8.nipic.com/20100731/3101644_214108073368_2.jpg","

","http://pic.nipic.com/2007-12-07/200712713242811_2.jpg"," window.onload=function() { var oBox=document.getElementById('box') var aLi=oBox.getElementsByTagName('li') var aImg=[] var aNewImg=[] for(var i=0i { var oImg=aLi[i].getElementsByTagName('img')[0] aImg.push(oImg) var newImg=new Image() aNewImg.push(newImg) } for(var i=0i { aNewImg[i].index=i aNewImg[i].onload=function() { aImg[this.index].src=this.src aImg[this.index].style.display="block" } aNewImg[i].onerror=function(){alert('图片出错')} aNewImg[i].src=arr[i] } } 1 2 3 4 5 "] window.onload=function() { var oBox=document.getElementById('box') var aLi=oBox.getElementsByTagName('li') var aImg=[] var aNewImg=[] for(var i=0i { var oImg=aLi[i].getElementsByTagName('img')[0] aImg.push(oImg) var newImg=new Image() aNewImg.push(newImg) } for(var i=0i { aNewImg[i].index=i aNewImg[i].onload=function() { aImg[this.index].src=this.src aImg[this.index].style.display="block" } aNewImg[i].onerror=function(){alert('图片出错')} aNewImg[i].src=arr[i] } } 1 2 3 4 5

"/>6 默认的第一张给一张模糊的

题主是否想询问“vue.js鼠标移动照片照片变模糊鼠标离开照片照片变清晰怎么办”?去后台icon字段中动态去找到并加载。使用vue实现,当鼠标移入和移出时,两种图片切换显示。项目情况:菜单上的图片的src的相对路径从后台icon字段中动态去找到并加载。