js如何设置 DIV层中的图片 部分区域显示

song1650 2007-04-19 04:55:36
js如何设置 DIV层中的图片 部分区域显示
其余部分 显示下层内容 ,但点击 非显示区域,获得的对象仍是 div层对象
...全文
2767 29 打赏 收藏 转发到动态 举报
写回复
用AI写文章
29 条回复
切换为时间正序
请发表友善的回复…
发表回复
zhaoting736488387 2011-11-21
  • 打赏
  • 举报
回复
div拖动的图片的那一部分,就把图片的那一部分显示出来
要怎样实现?
song1650 2007-04-30
  • 打赏
  • 举报
回复
谢谢  楼上的兄弟 呵呵 问题解决了
其实就是在上传的图片层上覆盖个含PNG产品图的层
再在PNG产品图的层上建立一个和上传的图片层相对应的 空的DIV层
使两个层是映射的关系哈哈无论移动那个 都是两个一起移动
haishui1650 2007-04-30
  • 打赏
  • 举报
回复
学习 哈哈
song1650 2007-04-23
  • 打赏
  • 举报
回复
顶下
大家来指导下
BlueDestiny 2007-04-23
  • 打赏
  • 举报
回复
以前写的,不用filter css实现filter,还没有写完,用样式1可用:D,图片下载完成后有效。

<!DOCTYPE html 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">
<head>
<title> - http://www.never-online.net </title>
<meta http-equiv="ImageToolbar" content="no" />
<meta name="author" content="never-online, BlueDestiny"/>
<meta name="keywords" content="never modules, Mozilla CSS, C#, .net, Reference, BlueDestiny, never-online"/>
<meta name="description" content="javascript reference, c sharp artilces"/>
<meta name="creator.name" content="never-online, BlueDestiny" />
<style type="text/css" media="all" title="Default">
.myFilterWrap { position:relative; border:1px solid #555; }
.myFiltercss { position:absolute; clip:rect(0 0 0 0); }
</style>
<script type="text/javascript">
//<![CDATA[
// http://www.never-online.net
// by never-online
var mysrc = "http://zi.csdn.net/2007.04/windows%20internal4.16.gif";

function myFilter (src, dir, isfilterin) {

if (!document.body) return false;
var cachep = new Image(); cachep.src = src;
var nDelay = 10; var strFt = "";

var wrap = document.createElement("DIV");
var image = document.createElement("IMG");
wrap.className = "myFilter";
document.body.appendChild(wrap);

image.height = cachep.height; image.width = cachep.width;
image.src = cachep.src; image.className = "myFiltercss";
wrap.appendChild(image);

function fnFt (dir) {
if (1==dir) {
return "rect("+(cnt++)+" auto auto auto)";
} else if (2==dir) {
return "rect(auto "+(cnt++)+" auto auto)";
} else if (3==dir) {
return "rect(auto auto "+(cnt++)+" auto)";
} else if (4==dir) {
return "rect(auto auto auto "+(cnt++)+")";
} else {
return "rect("+(cnt++)+" "+(cnt++)+" "+(cnt++)+" "+(cnt++)+")";
}
};


var cnt = 0; cachep.onload = function Fn () {
image.style.clip = fnFt(1);
if (cnt<=100) this._timeout=window.setTimeout(Fn, nDelay);
else window.clearTimeout(this._timeout);
};

}
//]]>
</script>
</head>

<body id="www.never-online.net">
<script type="text/javascript">
//<![CDATA[
myFilter.call(this, mysrc);
//]]>
</script>
</body>
</html>
song1650 2007-04-23
  • 打赏
  • 举报
回复
帮忙啊
vxinfo 2007-04-21
  • 打赏
  • 举报
回复
不会这个。
song1650 2007-04-20
  • 打赏
  • 举报
回复
不要沉啊
高手帮看看
song1650 2007-04-20
  • 打赏
  • 举报
回复
我现在想实现的功能是 同他的
移动图片时候,
部分在编辑区域,显示图片
部分在非编辑区域,透视到底图
但是研究了好久不知道
他的编辑区域是怎么设定的?透明的层?
怎么实现图片的 半边透明 半边显示?

还有他能在编辑区域外选中被移出的图层对象,
那么我们添加的图片层就应当是在他的底图(产品图)的上方
添加图片层 层中有我上传的图片 透明度为0
不知道这个 推论是不是正确的


hbhbhbhbhb1021 2007-04-20
  • 打赏
  • 举报
回复
的确是哦,挺好玩的。
song1650 2007-04-20
  • 打赏
  • 举报
回复
我的QQ是44714773
邮箱是 haishuizheng01@163.com
song1650 2007-04-20
  • 打赏
  • 举报
回复
"在图片上面在放了一个position为absolute的DIV"
是不是 比如图片1.jpg做为底图,上面再在特定的区域设置一个position为absolute的DIV
能不能给个 具体的设置 示例
通过这个position为absolute的DIV 就能透视到下一个图层吗??
song1650 2007-04-20
  • 打赏
  • 举报
回复
了解了 但是以下部分不知道 怎么设计
只要图片移动到 部分在编辑区域,显示图片
部分在非编辑区域,透视到底图
就是这个功能
帮我讲解下原理 谢谢
新手学习中 呵呵
song1650 2007-04-20
  • 打赏
  • 举报
回复
我的QQ是44714773
邮箱是 haishuizheng01@163.com
msn同上
希望大家给我 讲解下原理
大家共同研究学习哈哈~~~
先谢谢大家
song1650 2007-04-20
  • 打赏
  • 举报
回复
对啊 再 请问下 div中 css或filter有没有能实现
一半透明一半显示
图片可以使用shadow滤镜吗
hbhbhbhbhb1021 2007-04-20
  • 打赏
  • 举报
回复
多个的话也不会特别复杂,每添加一个生成一个组,而每个组之间是相对独立的。只是这么做的确感觉不是很好
song1650 2007-04-20
  • 打赏
  • 举报
回复
你这样的图层动态处理 就会很复杂啊
同时如果有 多个图片添加层 那逻辑就是很混乱的了
我认为他一个添加图片就是一个层
hbhbhbhbhb1021 2007-04-20
  • 打赏
  • 举报
回复
给你个例子,如果带移动的比较麻烦,差不多就是JS动态操作
<div id="progress_bg" style="position:absolute;top:0px;left:0px;width: 500px; height: 100%;width:500px;background:url(http://diy.kadang.com/kadang/ecommerce/style/default/diy/images/diy_65.png);text-align:center;z-index:3;filter:alpha(Opacity=40)"></div>
<div id="progress_fg" style="position:absolute;top:0px;left:470;width: 50px; height: 20px;z-index:4;border-left:thin solid red;border-top:thin solid red;border-bottom:thin solid red">asdasd</div>
<div style="position:absolute;top:0px;left:500px;width:50px;z-index:7;border-right:thin solid red;border-top:thin solid red;border-bottom:thin solid red"> </div>
<div style="position:absolute;top:0px;left:500px;width: 100%; height: 100%;z-index:6;background-color:white"></div>
song1650 2007-04-20
  • 打赏
  • 举报
回复
各位前辈帮忙看下
解答我的疑问
liyanghan 2007-04-19
  • 打赏
  • 举报
回复
我顶,hbhbhbhbhb1021(天外水火(我要多努力)) 你真强
我要狂学JS
加载更多回复(9)
序一(08/07/21) 很久之前就在一个网站的截取相片的功能中看到这个效果,也叫图片裁剪、图片剪切(设置一下也可以做出放大镜等类似的效果)。 当时觉得很神奇,碍于水平有限,没做出来。 前些日子突然想做一个透镜效果,就突然想到了这个效果,于是找出当年“珍藏”的代码决定一尝所愿。 序二(08/12/06) 自上一个版本的图片切割效果出来后,虽然也经常看到“框架开发这个如何如何容易”之类的评论,但也受到很多人的肯定,小弟在此感谢大家的支持。 上一个版本由于是初次接触这类效果,而且是三个大功能一起开发,能力所限,所以仅仅是实现了效果就完成了。 后来我知道这个效果叫ImageCropper,找了些这类效果参考,完善了切割的部分。 近来我把其中的拖放效果和缩放效果单独出来研究,经过整理和完善,再套进切割效果,个人感觉效果已经不错了。 要说明的是这个只是一个效果,并不是真正的切割图片,要获取真正的切割图片请参考图片切割系统。 先看看效果: 图片地址: 程序说明 这个效果主要分三个部分:层的拖放、层的缩放、图片切割(包括预览)。 其中层的拖放和层的缩放我已经在其他两篇文章中有详细说明,这里就说说图片切割这部分吧。 【图片切割】 关于图片切割的设计,有三个方法: 1.定位四个半透明层,遮住要盖住的部分,没试过,感觉比较麻烦; 2.把图片设为背景图,通过设置背景图的位置来实现,但这样的缺点是只能按图片的正常比例实现,不够灵活; 3.把图片放到切割对象里面,通过设置图片的top和left实现,这个方法是可行,但下面有更简单的方法实现; 4.通过设置图片的clip来实现。 这里介绍方法4的实现方法,这个方法是从当年“珍藏”的代码中看到的,先说说clip: clip的作用是“检索或设置对象的可视区域。可视区域外的部分是透明的。” 依据上-右-下-左的顺序提供自对象左上角为(0,0)坐标计算的四个偏移数值来剪切。 例如: div { position:absolute; width:60px; height:60px; clip:rect(0 20 50 10); } 注意position:absolute的设置是必须的(详细看手册)。 下面说说具体实现原理: 首先需要一个容器(_Container),容器里面会插入三个层: 底图层(_layBase):那个半透明的图片; 切割层(_layCropper):正常显示的那个部分; 控制层(_layHandle):就是控制显示的那个部分。 其中为了底图层和切割层是程序自动创建的图片,控制层是自己定义的层(程序中是一个div)。 底图层和切割层必须完全重合,程序中把这两个层都绝对定位到了左上角: this._layBase.style.top = this._layBase.style.left = this._layCropper.style.top = this._layCropper.style.left = 0; 层叠顺序也要设置一下保证各层顺序。 下面说说各部分的作用: 容器:除了容器本身的作用,通过设置其背景色来设置透明的渐变色,由于图片本身没有背景色所以要通过容器来设置; 底图层:在容器最底部,作用是显示非选择区域图片,透明效果就是在这层设置; 切割层:最关键的一个层,在底图层和控制层之间,在这个层通过clip设置其可视区域来实现切割图片的效果; 控制层:位于顶部,拖放(_drag)和缩放(_resize)效果就是在这个层实现,根据其拖放和缩放的结果控制切割层的切割效果。 这里要注意的是控制层的_drag拖放效果的Transparent要设为true(详细看拖放效果的透明背景bug部分)。 要使用缩放需要把Resize设为true,并设置各个拖拉对象,程序通过_resize设置缩放的比例和最少范围(详细看拖拉缩放效果)。 下面说说控制层如何控制切割效果: 控制层的拖放和缩放过程中加入了SetPos设置切割样式程序,在SetPos程序中根据控制层的样式设置切割层的可视区域范围: var p = this.GetPos(); this._layCropper.style.clip = "rect(" + p.Top + "px " + (p.Left + p.Width) + "px " + (p.Top + p.Height) + "px " + p.Left + "px)"; 其中GetPos程序,它可以把当前控制层的样式参数作为一个对象返回: with(this._layHandle){ return { Top: offsetTop, Left: offsetLeft, Width: offsetWidth, Height: offsetHeight } } 如果理解了的话就会觉得其实原理挺简单的,不过要想出来还是要一定创意才行,为想出这个方法的人致敬! 【切割预览】 预览效果需要设置Preview属性为预览容器对象,程序会自动给容器插入一个预览对象(图片)。 预览效果的关键在于如何根据控制层的数据来给预览对象定位,这个主要在SetPreview预览效果程序中处理。 首先根据控制层的高宽比置预览对象显示的宽和高(不是图片本身的宽高哦),这里可以用GetSize程序获取: var p = this.GetPos(), s = this.GetSize(p.Width, p.Height, this.viewWidth, this.viewHeight), scale = s.Height / p.Height; 其中GetSize获取尺寸程序可以根据图片实际大小按比例缩放到要设置的大小: Code var iWidth = nowWidth, iHeight = nowHeight, scale = iWidth / iHeight; //按比例设置 if(fixHeight){ iWidth = (iHeight = fixHeight) * scale; } if(fixWidth && (!fixHeight || iWidth > fixWidth)){ iHeight = (iWidth = fixWidth) / scale; } //返回尺寸对象 return { Width: iWidth, Height: iHeight } 可以看出如果后两个参数(viewWidth和this.viewHeight)都不设置就会按原来大小显示了, 然后再按预览图跟控制层的比例设置预览图的样式参数: var pHeight = this._layBase.height * scale, pWidth = this._layBase.width * scale, pTop = o.Top * scale, pLeft = o.Left * scale; 最后根据参数对预览对象进行样式设置和切割: Code with(this._view.style){ //设置样式 width = pWidth + "px"; height = pHeight + "px"; top = - pTop + "px "; left = - pLeft + "px"; //切割预览图 clip = "rect(" + pTop + "px " + (pLeft + s.Width) + "px " + (pTop + s.Height) + "px " + pLeft + "px)"; } 这里有点烦乱,但应该不难理解就不详细说明了。 【图片大小】 容器的大小一般是固定的,但图片的大小就不是固定的,这里又可以使用SetSize程序用来设置图片大小: Code var s = this.GetSize(this._tempImg.width, this._tempImg.height, this.Width, this.Height); //设置底图和切割图 this._layBase.style.width = this._layCropper.style.width = s.Width + "px"; this._layBase.style.height = this._layCropper.style.height = s.Height + "px"; 有了图片大小就可以用来设置拖放和缩放的范围限制了: Code this._drag.mxRight = s.Width; this._drag.mxBottom = s.Height; if(this.Resize){ this._resize.mxRight = s.Width; this._resize.mxBottom = s.Height; } ps:程序中的Init程序是用来把个性设置呈现出来,所以一般设置过属性之后(例如图片地址、透明度等)就执行一次Init程序就可以显示效果了。 【ie6渲染bug】 在拖放效果中说到插入一个div解决ie的透明背景bug,这里就需要修复这个bug。 跟缩放效果配合使用时,不得不说ie6的一个渲染bug,用下面的代码测试(ie6): Code <div id="aa" style="width:300px;height:100px;border:1px solid;"><div style="background:#00f;height:100%;">div>div> <script>setTimeout("aa.style.height=200",0) window.__INITIAL_STATE__= {"csrf":"x1rI2P0O-0NySHBCVW6vr1fssLEISooPX-Fs","origin":"http:\u002F\u002Fbbs.csdn.net","isMobile":false,"cookie":"uuid_tt_dd=10_7511373720-1711653618389-505720;","ip":"44.197.114.92","pageData":{"page":{"pageId":143,"title":"社区详情","keywords":"社区详情","description":"社区详情","ext":{"isMd":"true","armsfe1":"{pid:\"dyiaei5ihw@1a348e4d05c2c78\",appType:\"web\",imgUrl:\"https:\u002F\u002Farms-retcode.aliyuncs.com\u002Fr.png?\",sendResource:true,enableLinkTrace:true,behavior:true}","redPacketCfg":"{\"presetTitle\":[\"成就一亿技术人!\",\"大吉大利\",\"节日快乐\",\"Bug Free\",\"Hello World\",\"Be Greater Than Average!!\"],\"defaultTitle\":\"成就一亿技术人!\",\"preOpenSty\":{},\"redCardSty\":{}}","blogStar":"[{\"year\":\"2021\",\"enable\":true,\"communityIds\":[3859],\"url\":\"https:\u002F\u002Fbbs.csdn.net\u002Fsummary2021\"},{\"year\":\"2022\",\"enable\":true,\"communityIds\":[3860],\"url\":\"https:\u002F\u002Fbbs.csdn.net\u002Fsummary2022\"}]","mdVersion":"https:\u002F\u002Fcsdnimg.cn\u002Frelease\u002Fmarkdown-editor\u002F1.1.0\u002Fmarkdown-editor.js","componentSortCfg":"{ \"right\":[\"ratesInfo\",\"cty-profile\",\"pub-comp\",\"user-right-introduce\",\"post-event\",\"my-mission\",\"user-recommend\",\"user-right-rank\",\"user-right-rule\",\"user-right-adimg\"] }","show_1024":"{\"enable\":false,\"useWhitelist\":false,\"whitelist\":[76215],\"home\":\"https:\u002F\u002F1111.csdn.net\u002F\",\"logo\":\"https:\u002F\u002Fimg-home.csdnimg.cn\u002Fimages\u002F20221104102741.png\",\"hideLive\":true}","iframes":"[\"3859\"]","pageCfg":"{\"disableDownloadPDF\": false,\"hideSponsor\":false}"}},"template":{"templateId":71,"templateComponentName":"ccloud-detail","title":"ccloud-detail","floorList":[{"floorId":562,"floorComponentName":"floor-user-content","title":"社区详情页","description":"社区详情页","indexOrder":3,"componentList":[{"componentName":"baseInfo","componentDataId":"cloud-detail1","componentConfigData":{},"relationType":3},{"componentName":"user-right-introduce","componentDataId":"","componentConfigData":{},"relationType":2},{"componentName":"user-recommend","componentDataId":"","componentConfigData":{},"relationType":2},{"componentName":"user-right-rank","componentDataId":"","componentConfigData":{},"relationType":2},{"componentName":"user-right-rule","componentDataId":"","componentConfigData":{},"relationType":2},{"componentName":"user-right-adimg","componentDataId":"","componentConfigData":{},"relationType":2},{"componentName":"default2014LiveRoom","componentDataId":"20221024DefaultLiveRoom","componentConfigData":{},"relationType":3}]}]},"data":{"baseInfo":{"customDomain":"","uriName":"JavaScript","communityHomePage":"https:\u002F\u002Fbbs.csdn.net\u002Fforums\u002FJavaScript","owner":{"userName":"community_91","nickName":"JavaScript","avatarUrl":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","position":"","companyName":""},"user":{"userRole":3,"userName":null,"nickName":null,"avatarUrl":null,"rank":null,"follow":2,"communityBase":null,"joinCollege":null,"isVIP":null},"community":{"name":"JavaScript","description":"Web 开发 JavaScript","avatarUrl":"https:\u002F\u002Fimg-community.csdnimg.cn\u002Favatar\u002Fca46c476a908476d9927eaee4b0afc10.png?x-oss-process=image\u002Fresize,m_fixed,h_88,w_88","qrCode":"","createTime":"2007-09-28","communityAvatarUrl":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","communityNotice":null,"userCount":87901,"contentCount":224618,"followersCount":53223,"communityRule":"","communityId":209,"bgImage":"","hashId":"y3w0yonz","domain":"","uriName":"JavaScript","externalDisplay":1,"adBanner":{"img":"","url":"","adType":0,"adCon":null},"rightBanner":{"img":"","url":"","adType":0,"adCon":null},"tagId":null,"tagName":null,"communityType":1,"communityApplyUrl":"https:\u002F\u002Fmarketing.csdn.net\u002Fquestions\u002FQ2106040308026533763","joinType":0,"visibleType":0,"collapse":0,"topicMoveAble":0,"allowActions":{},"communityOwner":"community_91","tagNameInfo":{"provinceTag":null,"areaTag":null,"technologyTags":null,"customTags":null}},"tabList":[{"tabId":1368,"tabName":"全部","tabUrl":"","tabSwitch":1,"tabType":4,"tabContribute":0,"cardType":0,"indexOrder":-1,"url":"https:\u002F\u002Fbbs.csdn.net\u002Fforums\u002FJavaScript?typeId=1368","iframe":false,"sortType":1},{"tabId":873,"tabName":"问答","tabUrl":"https:\u002F\u002Fask.csdn.net\u002Flist\u002F11\u002Ftag\u002F190","tabSwitch":1,"tabType":0,"tabContribute":0,"indexOrder":0,"iframe":true,"sortType":1},{"tabId":4055678,"tabName":"博文收录","tabUrl":"","tabSwitch":1,"tabType":2,"tabContribute":0,"cardType":0,"indexOrder":19,"url":"https:\u002F\u002Fbbs.csdn.net\u002Fforums\u002FJavaScript?typeId=4055678","iframe":false,"sortType":1},{"tabId":1620032,"tabName":"Ada助手","tabUrl":"","tabSwitch":1,"tabType":2,"tabContribute":0,"cardType":0,"indexOrder":20,"url":"https:\u002F\u002Fbbs.csdn.net\u002Fforums\u002FJavaScript?typeId=1620032","iframe":false,"sortType":1}],"dataResource":{"mediaType":"c_cloud","subResourceType":"8_c_cloud_long_text","showType":"long_text","tabId":0,"communityName":"JavaScript","communityHomePageUrl":"https:\u002F\u002Fbbs.csdn.net\u002Fforums\u002FJavaScript","communityType":1,"content":{"id":"110014715","contentId":110014715,"cateId":0,"cateName":null,"url":"https:\u002F\u002Fbbs.csdn.net\u002Ftopics\u002F110014715","shareUrl":"https:\u002F\u002Fbbs.csdn.net\u002Ftopics\u002F110014715","createTime":"2007-04-19 04:55:36","updateTime":"2021-05-28 15:18:31","resourceUsername":"song1650","best":0,"top":0,"text":null,"publishDate":"2007-04-19","lastReplyDate":"2011-11-21","type":"13","nickname":"song1650","avatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","username":"song1650","commentCount":29,"diggNum":0,"digg":false,"viewCount":2767,"hit":false,"resourceSource":6,"status":10,"taskStatus":null,"expired":false,"taskCate":0,"taskAward":0,"taskExpired":null,"checkRedPacket":null,"avgScore":0,"totalScore":0,"topicTitle":"js如何设置 DIV层中的图片 部分区域显示","insertFirst":false,"likeInfo":null,"description":"js如何设置 DIV层中的图片 部分区域显示 其余部分 显示下层内容 ,但点击 非显示区域,获得的对象仍是 div层对象","coverImg":"https:\u002F\u002Fimg-home.csdnimg.cn\u002Fimages\u002F20221027062414.png","content":"js如何设置 DIV层中的图片 部分区域显示\u003Cbr \u002F\u003E\n其余部分 显示下层内容 ,但点击 非显示区域,获得的对象仍是 div层对象","mdContent":null,"pictures":null,"videoInfo":null,"linkInfo":null,"student":{"isCertification":false,"org":"","bala":""},"employee":{"isCertification":false,"org":"","bala":""},"userCertification":[],"dependId":"0","dependSubType":null,"videoUrl":null,"favoriteCount":0,"favoriteStatus":false,"taskType":null,"defaultScore":null,"syncAsk":false,"videoPlayLength":null},"communityUser":null,"allowPost":false,"submitHistory":[{"user":{"registerurl":"https:\u002F\u002Fg.csdnimg.cn\u002Fstatic\u002Fuser-reg-year\u002F1x\u002F17.png","avatarurl":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","nickname":"song1650","selfdesc":"","createdate":"2006-10-11 08:57:00","days":"6379","years":"17","username":"song1650","school":null,"company":null,"job":null},"userName":"song1650","event":"创建了帖子","body":"2007-04-19 04:55","editId":null}],"resourceExt":{}},"contentReply":{"pageNo":1,"pageSize":20,"totalPages":1,"totalCount":29,"total":0,"list":[{"hit":null,"hitMsg":null,"content":"div拖动的图片的那一部分,就把图片的那一部分显示出来\u003Cbr \u002F\u003E\n要怎样实现?","topicTitle":null,"description":"div拖动的图片的那一部分,就把图片的那一部分显示出来 要怎样实现?","id":190288269,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"zhaoting736488387","userNickName":"zhaoting736488387","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":22403813,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2011-11-21 05:24:30","updateTime":"2011-11-21 05:24:16","formatTime":"2011-11-21","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"谢谢  楼上的兄弟 呵呵 问题解决了\u003Cbr \u002F\u003E\n其实就是在上传的图片层上覆盖个含PNG产品图的层\u003Cbr \u002F\u003E\n再在PNG产品图的层上建立一个和上传的图片层相对应的 空的DIV层\u003Cbr \u002F\u003E\n使两个层是映射的关系哈哈无论移动那个 都是两个一起移动","topicTitle":null,"description":"谢谢  楼上的兄弟 呵呵 问题解决了 其实就是在上传的图片层上覆盖个含PNG产品图的层 再在PNG产品图的层上建立一个和上传的图片层相对应的 空的DIV层 使两个层是映射的关系哈哈无论移动那个 都是两个一起移动","id":110400505,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3683028583,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-30 10:23:49","updateTime":"2007-04-30 10:23:49","formatTime":"2007-04-30","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"学习 哈哈","topicTitle":null,"description":"学习 哈哈","id":110400219,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"haishui1650","userNickName":"haishui1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3683028583,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-30 10:15:41","updateTime":"2007-04-30 10:15:41","formatTime":"2007-04-30","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"顶下 \u003Cbr \u002F\u003E\n大家来指导下","topicTitle":null,"description":"顶下 大家来指导下","id":110227086,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":992502337,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-23 10:28:34","updateTime":"2007-04-23 10:28:34","formatTime":"2007-04-23","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"以前写的,不用filter css实现filter,还没有写完,用样式1可用:D,图片下载完成后有效。\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n<!DOCTYPE html PUBLIC "-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Strict\u002F\u002FEN"\u003Cbr \u002F\u003E\n"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-strict.dtd">\u003Cbr \u002F\u003E\n<html xmlns="http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml">\u003Cbr \u002F\u003E\n <head>\u003Cbr \u002F\u003E\n <title> - http:\u002F\u002Fwww.never-online.net <\u002Ftitle>\u003Cbr \u002F\u003E\n <meta http-equiv="ImageToolbar" content="no" \u002F>\u003Cbr \u002F\u003E\n <meta name="author" content="never-online, BlueDestiny"\u002F>\u003Cbr \u002F\u003E\n <meta name="keywords" content="never modules, Mozilla CSS, C#, .net, Reference, BlueDestiny, never-online"\u002F>\u003Cbr \u002F\u003E\n <meta name="description" content="javascript reference, c sharp artilces"\u002F>\u003Cbr \u002F\u003E\n <meta name="creator.name" content="never-online, BlueDestiny" \u002F>\u003Cbr \u002F\u003E\n <style type="text\u002Fcss" media="all" title="Default">\u003Cbr \u002F\u003E\n .myFilterWrap { position:relative; border:1px solid #555; }\u003Cbr \u002F\u003E\n .myFiltercss { position:absolute; clip:rect(0 0 0 0); }\u003Cbr \u002F\u003E\n <\u002Fstyle>\u003Cbr \u002F\u003E\n <script type="text\u002Fjavascript">\u003Cbr \u002F\u003E\n \u002F\u002F<![CDATA[\u003Cbr \u002F\u003E\n \u002F\u002F http:\u002F\u002Fwww.never-online.net\u003Cbr \u002F\u003E\n \u002F\u002F by never-online\u003Cbr \u002F\u003E\n var mysrc = "http:\u002F\u002Fzi.csdn.net\u002F2007.04\u002Fwindows%20internal4.16.gif";\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n function myFilter (src, dir, isfilterin) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n if (!document.body) return false;\u003Cbr \u002F\u003E\n var cachep = new Image(); cachep.src = src;\u003Cbr \u002F\u003E\n var nDelay = 10; var strFt = "";\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n var wrap = document.createElement("DIV");\u003Cbr \u002F\u003E\n var image = document.createElement("IMG");\u003Cbr \u002F\u003E\n wrap.className = "myFilter";\u003Cbr \u002F\u003E\n document.body.appendChild(wrap);\u003Cbr \u002F\u003E\n \u003Cbr \u002F\u003E\n image.height = cachep.height; image.width = cachep.width;\u003Cbr \u002F\u003E\n image.src = cachep.src; image.className = "myFiltercss";\u003Cbr \u002F\u003E\n wrap.appendChild(image);\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n function fnFt (dir) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n if (1==dir) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n return "rect("+(cnt++)+" auto auto auto)";\u003Cbr \u002F\u003E\n } else if (2==dir) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n return "rect(auto "+(cnt++)+" auto auto)";\u003Cbr \u002F\u003E\n } else if (3==dir) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n return "rect(auto auto "+(cnt++)+" auto)";\u003Cbr \u002F\u003E\n } else if (4==dir) {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n return "rect(auto auto auto "+(cnt++)+")";\u003Cbr \u002F\u003E\n } else {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n return "rect("+(cnt++)+" "+(cnt++)+" "+(cnt++)+" "+(cnt++)+")";\u003Cbr \u002F\u003E\n }\u003Cbr \u002F\u003E\n };\u003Cbr \u002F\u003E\n \u003Cbr \u002F\u003E\n \u003Cbr \u002F\u003E\n var cnt = 0; cachep.onload = function Fn () {\u003C!-- --\u003E\u003Cbr \u002F\u003E\n image.style.clip = fnFt(1);\u003Cbr \u002F\u003E\n if (cnt<=100) this._timeout=window.setTimeout(Fn, nDelay);\u003Cbr \u002F\u003E\n else window.clearTimeout(this._timeout);\u003Cbr \u002F\u003E\n };\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n }\u003Cbr \u002F\u003E\n \u002F\u002F]]>\u003Cbr \u002F\u003E\n <\u002Fscript>\u003Cbr \u002F\u003E\n <\u002Fhead>\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n <body id="www.never-online.net">\u003Cbr \u002F\u003E\n <script type="text\u002Fjavascript">\u003Cbr \u002F\u003E\n \u002F\u002F<![CDATA[\u003Cbr \u002F\u003E\n myFilter.call(this, mysrc);\u003Cbr \u002F\u003E\n \u002F\u002F]]>\u003Cbr \u002F\u003E\n <\u002Fscript>\u003Cbr \u002F\u003E\n <\u002Fbody>\u003Cbr \u002F\u003E\n<\u002Fhtml>\u003Cbr \u002F\u003E\n","topicTitle":null,"description":"以前写的,不用filter css实现filter,还没有写完,用样式1可用:D,图片下载完成后有效。 \u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Strict\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-strict.dtd\"\u003E \u003Chtml xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\"\u003E \u003Chead\u003E \u003Ctitle\u003E - http:\u002F\u002Fwww.never-online.net","id":110244991,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"BlueDestiny","userNickName":"BlueDestiny","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fc2b32e43f1464063bd5c1e858ef35bae_bluedestiny.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3684653297,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-23 09:45:14","updateTime":"2007-04-23 09:45:14","formatTime":"2007-04-23","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"帮忙啊","topicTitle":null,"description":"帮忙啊","id":110233204,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":992502337,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-23 01:39:11","updateTime":"2007-04-23 01:39:11","formatTime":"2007-04-23","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"不会这个。","topicTitle":null,"description":"不会这个。","id":110203892,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"vxinfo","userNickName":"vxinfo","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":1017891605,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-21 09:41:56","updateTime":"2007-04-21 09:41:56","formatTime":"2007-04-21","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"不要沉啊\u003Cbr \u002F\u003E\n高手帮看看","topicTitle":null,"description":"不要沉啊 高手帮看看","id":101795036,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 12:30:25","updateTime":"2007-04-20 12:30:25","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"我现在想实现的功能是 同他的\u003Cbr \u002F\u003E\n移动图片时候,\u003Cbr \u002F\u003E\n部分在编辑区域,显示图片\u003Cbr \u002F\u003E\n部分在非编辑区域,透视到底图\u003Cbr \u002F\u003E\n但是研究了好久不知道 \u003Cbr \u002F\u003E\n他的编辑区域是怎么设定的?透明的层?\u003Cbr \u002F\u003E\n怎么实现图片的 半边透明 半边显示?\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n还有他能在编辑区域外选中被移出的图层对象, \u003Cbr \u002F\u003E\n那么我们添加的图片层就应当是在他的底图(产品图)的上方\u003Cbr \u002F\u003E\n添加图片层 层中有我上传的图片 透明度为0\u003Cbr \u002F\u003E\n不知道这个 推论是不是正确的\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n\u003Cbr \u002F\u003E\n","topicTitle":null,"description":"我现在想实现的功能是 同他的 移动图片时候, 部分在编辑区域,显示图片 部分在非编辑区域,透视到底图 但是研究了好久不知道 他的编辑区域是怎么设定的?透明的层? 怎么实现图片的 半边透明 半边显示? 还有他能在编辑区域外选中被移出的图层对象, 那么我们添加的图片层就应当是在他的底图(产品图)的上方 添加图片层 层中有我上传的图片 透明度为0 不知道这个 推论是不是正确的 ","id":101792355,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 11:06:26","updateTime":"2007-04-20 11:06:26","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"的确是哦,挺好玩的。","topicTitle":null,"description":"的确是哦,挺好玩的。","id":101791674,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"hbhbhbhbhb1021","userNickName":"hbhbhbhbhb1021","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3662796863,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 10:49:26","updateTime":"2007-04-20 10:49:26","formatTime":"2007-04-20","userRoleHonorary":{"userName":"hbhbhbhbhb1021","roleId":214,"roleType":0,"roleStatus":1,"honoraryId":0,"roleName":"","honoraryName":null,"communityNickname":"","communitySignature":""},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"我的QQ是44714773\u003Cbr \u002F\u003E\n邮箱是 haishuizheng01@163.com","topicTitle":null,"description":"我的QQ是44714773 邮箱是 haishuizheng01@163.com","id":101787872,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 09:09:00","updateTime":"2007-04-20 09:09:00","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":""在图片上面在放了一个position为absolute的DIV"\u003Cbr \u002F\u003E\n是不是 比如图片1.jpg做为底图,上面再在特定的区域设置一个position为absolute的DIV\u003Cbr \u002F\u003E\n能不能给个 具体的设置 示例\u003Cbr \u002F\u003E\n通过这个position为absolute的DIV 就能透视到下一个图层吗??","topicTitle":null,"description":""在图片上面在放了一个position为absolute的DIV" 是不是 比如图片1.jpg做为底图,上面再在特定的区域设置一个position为absolute的DIV 能不能给个 具体的设置 示例 通过这个position为absolute的DIV 就能透视到下一个图层吗??","id":101787765,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 09:05:19","updateTime":"2007-04-20 09:05:19","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"了解了 但是以下部分不知道 怎么设计\u003Cbr \u002F\u003E\n只要图片移动到 部分在编辑区域,显示图片\u003Cbr \u002F\u003E\n部分在非编辑区域,透视到底图\u003Cbr \u002F\u003E\n就是这个功能\u003Cbr \u002F\u003E\n 帮我讲解下原理 谢谢\u003Cbr \u002F\u003E\n新手学习中 呵呵","topicTitle":null,"description":"了解了 但是以下部分不知道 怎么设计 只要图片移动到 部分在编辑区域,显示图片 部分在非编辑区域,透视到底图 就是这个功能 帮我讲解下原理 谢谢 新手学习中 呵呵","id":101787536,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 08:58:03","updateTime":"2007-04-20 08:58:03","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"我的QQ是44714773\u003Cbr \u002F\u003E\n邮箱是 haishuizheng01@163.com\u003Cbr \u002F\u003E\nmsn同上\u003Cbr \u002F\u003E\n希望大家给我 讲解下原理\u003Cbr \u002F\u003E\n大家共同研究学习哈哈~~~\u003Cbr \u002F\u003E\n先谢谢大家","topicTitle":null,"description":"我的QQ是44714773 邮箱是 haishuizheng01@163.com msn同上 希望大家给我 讲解下原理 大家共同研究学习哈哈~~~ 先谢谢大家","id":110198239,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 06:03:25","updateTime":"2007-04-20 06:03:25","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"对啊 再 请问下 div中 css或filter有没有能实现\u003Cbr \u002F\u003E\n一半透明一半显示\u003Cbr \u002F\u003E\n 图片可以使用shadow滤镜吗","topicTitle":null,"description":"对啊 再 请问下 div中 css或filter有没有能实现 一半透明一半显示 图片可以使用shadow滤镜吗","id":101800908,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 03:26:54","updateTime":"2007-04-20 03:26:54","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"多个的话也不会特别复杂,每添加一个生成一个组,而每个组之间是相对独立的。只是这么做的确感觉不是很好","topicTitle":null,"description":"多个的话也不会特别复杂,每添加一个生成一个组,而每个组之间是相对独立的。只是这么做的确感觉不是很好","id":101799937,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"hbhbhbhbhb1021","userNickName":"hbhbhbhbhb1021","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3662796863,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 02:55:46","updateTime":"2007-04-20 02:55:46","formatTime":"2007-04-20","userRoleHonorary":{"userName":"hbhbhbhbhb1021","roleId":214,"roleType":0,"roleStatus":1,"honoraryId":0,"roleName":"","honoraryName":null,"communityNickname":"","communitySignature":""},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"你这样的图层动态处理 就会很复杂啊\u003Cbr \u002F\u003E\n同时如果有 多个图片添加层 那逻辑就是很混乱的了\u003Cbr \u002F\u003E\n我认为他一个添加图片就是一个层","topicTitle":null,"description":"你这样的图层动态处理 就会很复杂啊 同时如果有 多个图片添加层 那逻辑就是很混乱的了 我认为他一个添加图片就是一个层","id":101799769,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 02:48:39","updateTime":"2007-04-20 02:48:39","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"给你个例子,如果带移动的比较麻烦,差不多就是JS动态操作\u003Cbr \u002F\u003E\n<div id="progress_bg" style="position:absolute;top:0px;left:0px;width: 500px; height: 100%;width:500px;background:url(http:\u002F\u002Fdiy.kadang.com\u002Fkadang\u002Fecommerce\u002Fstyle\u002Fdefault\u002Fdiy\u002Fimages\u002Fdiy_65.png);text-align:center;z-index:3;filter:alpha(Opacity=40)"><\u002Fdiv>\u003Cbr \u002F\u003E\n<div id="progress_fg" style="position:absolute;top:0px;left:470;width: 50px; height: 20px;z-index:4;border-left:thin solid red;border-top:thin solid red;border-bottom:thin solid red">asdasd<\u002Fdiv>\u003Cbr \u002F\u003E\n<div style="position:absolute;top:0px;left:500px;width:50px;z-index:7;border-right:thin solid red;border-top:thin solid red;border-bottom:thin solid red"> <\u002Fdiv>\u003Cbr \u002F\u003E\n<div style="position:absolute;top:0px;left:500px;width: 100%; height: 100%;z-index:6;background-color:white"><\u002Fdiv>","topicTitle":null,"description":"给你个例子,如果带移动的比较麻烦,差不多就是JS动态操作 \u003Cdiv id=\"progress_bg\" style=\"position:absolute;top:0px;left:0px;width: 500px; height: 100%;width:500px;background:url(http:\u002F\u002Fdiy.kadang.com\u002Fkadang\u002Fecommerce\u002Fstyle\u002Fdefault\u002Fdiy\u002Fimages\u002Fdiy_65.png);text-align:center;z-index:3","id":101799328,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"hbhbhbhbhb1021","userNickName":"hbhbhbhbhb1021","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":3662796863,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 02:33:53","updateTime":"2007-04-20 02:33:53","formatTime":"2007-04-20","userRoleHonorary":{"userName":"hbhbhbhbhb1021","roleId":214,"roleType":0,"roleStatus":1,"honoraryId":0,"roleName":"","honoraryName":null,"communityNickname":"","communitySignature":""},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"各位前辈帮忙看下\u003Cbr \u002F\u003E\n解答我的疑问","topicTitle":null,"description":"各位前辈帮忙看下 解答我的疑问","id":101797836,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"song1650","userNickName":"song1650","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":977081090,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-20 01:45:04","updateTime":"2007-04-20 01:45:04","formatTime":"2007-04-20","userRoleHonorary":{"userName":null,"roleId":null,"roleType":null,"roleStatus":null,"honoraryId":null,"roleName":null,"honoraryName":null,"communityNickname":null,"communitySignature":null},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null},{"hit":null,"hitMsg":null,"content":"我顶,hbhbhbhbhb1021(天外水火(我要多努力)) 你真强\u003Cbr \u002F\u003E\n我要狂学JS","topicTitle":null,"description":"我顶,hbhbhbhbhb1021(天外水火(我要多努力)) 你真强 我要狂学JS","id":101783339,"contentResourceId":110014715,"bindContentResourceId":0,"communityId":209,"username":"liyanghan","userNickName":"liyanghan","userAvatar":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","mdContent":null,"parentId":0,"replyName":"","replyNickName":"","bizNo":"bbs","ip":1018265667,"status":10,"childCount":0,"topStatus":0,"recommendStatus":0,"userLike":false,"diggCount":0,"childIds":"","createTime":"2007-04-19 08:19:08","updateTime":"2007-04-19 08:19:08","formatTime":"2007-04-19","userRoleHonorary":{"userName":"liyanghan","roleId":214,"roleType":0,"roleStatus":1,"honoraryId":0,"roleName":"","honoraryName":null,"communityNickname":"","communitySignature":""},"child":null,"communityNickname":null,"communityReplyNickname":null,"rewardInfo":null,"checkRedPacketVO":null,"noDiggCount":null}],"maxPageSize":3000},"defaultActiveTab":1368,"recommends":[{"url":"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fxxd851116\u002F1332114","title":"JavaScript \u003Cem\u003E图片\u003C\u002Fem\u003E切割效果","desc":"序一(08\u002F07\u002F21)\n\n很久之前就在一个网站的截取相片的功能中看到这个效果,也叫\u003Cem\u003E图片\u003C\u002Fem\u003E裁剪、\u003Cem\u003E图片\u003C\u002Fem\u003E剪切(\u003Cem\u003E设置\u003C\u002Fem\u003E一下也可以做出放大镜等类似的效果)。\n当时觉得很神奇,碍于水平有限,没做出来。\n前些日子突然想做一个透镜效果,就突然想到了这个效果,于是找出当年“珍藏”的代码决定一尝所愿。\n\n序二(08\u002F12\u002F06)\n\n自上一个版本的\u003Cem\u003E图片\u003C\u002Fem\u003E切割效果出来后,虽然也经常看到“框架开发这个如何如何容易”之类的评论,但也受到很多人的肯定,小弟在此感谢大家的支持。\n上一个版本由于是初次接触这类效果,而且是三个大功能一起开发,能力所限,所以仅仅是实现了效果就完成了。\n后来我知道这个效果叫ImageCropper,找了些这类效果参考,完善了切割的\u003Cem\u003E部分\u003C\u002Fem\u003E。\n近来我把其中的拖放效果和缩放效果单独出来研究,经过整理和完善,再套进切割效果,个人感觉效果已经不错了。\n要说明的是这个只是一个效果,并不是真正的切割\u003Cem\u003E图片\u003C\u002Fem\u003E,要获取真正的切割\u003Cem\u003E图片\u003C\u002Fem\u003E请参考\u003Cem\u003E图片\u003C\u002Fem\u003E切割系统。\n\n先看看效果:\n\n \n\n \n\n\u003Cem\u003E图片\u003C\u002Fem\u003E地址: \n\n\n程序说明\n\n这个效果主要分三个\u003Cem\u003E部分\u003C\u002Fem\u003E:层的拖放、层的缩放、\u003Cem\u003E图片\u003C\u002Fem\u003E切割(包括预览)。\n其中层的拖放和层的缩放我已经在其他两篇文章中有详细说明,这里就说说\u003Cem\u003E图片\u003C\u002Fem\u003E切割这\u003Cem\u003E部分\u003C\u002Fem\u003E吧。\n\n【\u003Cem\u003E图片\u003C\u002Fem\u003E切割】\n\n关于\u003Cem\u003E图片\u003C\u002Fem\u003E切割的设计,有三个方法:\n1.定位四个半透明层,遮住要盖住的\u003Cem\u003E部分\u003C\u002Fem\u003E,没试过,感觉比较麻烦;\n2.把\u003Cem\u003E图片\u003C\u002Fem\u003E设为背景图,通过\u003Cem\u003E设置\u003C\u002Fem\u003E背景图的位置来实现,但这样的缺点是只能按\u003Cem\u003E图片\u003C\u002Fem\u003E的正常比例实现,不够灵活;\n3.把\u003Cem\u003E图片\u003C\u002Fem\u003E放到切割对象里面,通过\u003Cem\u003E设置\u003C\u002Fem\u003E\u003Cem\u003E图片\u003C\u002Fem\u003E的top和left实现,这个方法是可行,但下面有更简单的方法实现;\n4.通过\u003Cem\u003E设置\u003C\u002Fem\u003E\u003Cem\u003E图片\u003C\u002Fem\u003E的clip来实现。\n\n这里介绍方法4的实现方法,这个方法是从当年“珍藏”的代码中看到的,先说说clip:\nclip的作用是“检索或\u003Cem\u003E设置\u003C\u002Fem\u003E对象的可视\u003Cem\u003E区域\u003C\u002Fem\u003E。可视\u003Cem\u003E区域\u003C\u002Fem\u003E外的\u003Cem\u003E部分\u003C\u002Fem\u003E是透明的。”\n依据上-右-下-左的顺序提供自对象左上角为(0,0)坐标计算的四个偏移数值来剪切。\n例如:\n\n\u003Cem\u003Ediv\u003C\u002Fem\u003E { position:absolute; width:60px; height:60px; clip:rect(0 20 50 10); }\n\n注意position:absolute的\u003Cem\u003E设置\u003C\u002Fem\u003E是必须的(详细看手册)。\n\n下面说说具体实现原理:\n首先需要一个容器(_Container),容器里面会插入三个层:\n底图层(_layBase):那个半透明的\u003Cem\u003E图片\u003C\u002Fem\u003E;\n切割层(_layCropper):正常\u003Cem\u003E显示\u003C\u002Fem\u003E的那个\u003Cem\u003E部分\u003C\u002Fem\u003E;\n控制层(_layHandle):就是控制\u003Cem\u003E显示\u003C\u002Fem\u003E的那个\u003Cem\u003E部分\u003C\u002Fem\u003E。\n\n其中为了底图层和切割层是程序自动创建的\u003Cem\u003E图片\u003C\u002Fem\u003E,控制层是自己定义的层(程序中是一个\u003Cem\u003Ediv\u003C\u002Fem\u003E)。\n底图层和切割层必须完全重合,程序中把这两个层都绝对定位到了左上角:\n\nthis._layBase.style.top = this._layBase.style.left = this._layCropper.style.top = this._layCropper.style.left = 0;\n\n层叠顺序也要\u003Cem\u003E设置\u003C\u002Fem\u003E一下保证各层顺序。\n\n下面说说各\u003Cem\u003E部分\u003C\u002Fem\u003E的作用:\n容器:除了容器本身的作用,通过\u003Cem\u003E设置\u003C\u002Fem\u003E其背景色来\u003Cem\u003E设置\u003C\u002Fem\u003E透明的渐变色,由于\u003Cem\u003E图片\u003C\u002Fem\u003E本身没有背景色所以要通过容器来\u003Cem\u003E设置\u003C\u002Fem\u003E;\n底图层:在容器最底部,作用是\u003Cem\u003E显示\u003C\u002Fem\u003E非选择\u003Cem\u003E区域\u003C\u002Fem\u003E的\u003Cem\u003E图片\u003C\u002Fem\u003E,透明效果就是在这层\u003Cem\u003E设置\u003C\u002Fem\u003E;\n切割层:最关键的一个层,在底图层和控制层之间,在这个层通过clip\u003Cem\u003E设置\u003C\u002Fem\u003E其可视\u003Cem\u003E区域\u003C\u002Fem\u003E来实现切割\u003Cem\u003E图片\u003C\u002Fem\u003E的效果;\n控制层:位于顶部,拖放(_drag)和缩放(_resize)效果就是在这个层实现,根据其拖放和缩放的结果控制切割层的切割效果。\n\n这里要注意的是控制层的_drag拖放效果的Transparent要设为true(详细看拖放效果的透明背景bug\u003Cem\u003E部分\u003C\u002Fem\u003E)。\n要使用缩放需要把Resize设为true,并\u003Cem\u003E设置\u003C\u002Fem\u003E各个拖拉对象,程序通过_resize\u003Cem\u003E设置\u003C\u002Fem\u003E缩放的比例和最少范围(详细看拖拉缩放效果)。\n\n下面说说控制层如何控制切割效果:\n控制层的拖放和缩放过程中加入了SetPos\u003Cem\u003E设置\u003C\u002Fem\u003E切割样式程序,在SetPos程序中根据控制层的样式\u003Cem\u003E设置\u003C\u002Fem\u003E切割层的可视\u003Cem\u003E区域\u003C\u002Fem\u003E范围:\n\nvar p = this.GetPos();\nthis._layCropper.style.clip = \"rect(\" + p.Top + \"px \" + (p.Left + p.Width) + \"px \" + (p.Top + p.Height) + \"px \" + p.Left + \"px)\";\n\n其中GetPos程序,它可以把当前控制层的样式参数作为一个对象返回:\n\nwith(this._layHandle){\n return { Top: offsetTop, Left: offsetLeft, Width: offsetWidth, Height: offsetHeight }\n}\n\n如果理解了的话就会觉得其实原理挺简单的,不过要想出来还是要一定创意才行,为想出这个方法的人致敬!\n\n【切割预览】\n\n预览效果需要\u003Cem\u003E设置\u003C\u002Fem\u003EPreview属性为预览容器对象,程序会自动给容器插入一个预览对象(\u003Cem\u003E图片\u003C\u002Fem\u003E)。\n预览效果的关键在于如何根据控制层的数据来给预览对象定位,这个主要在SetPreview预览效果程序中处理。\n首先根据控制层的高宽比置预览对象\u003Cem\u003E显示\u003C\u002Fem\u003E的宽和高(不是\u003Cem\u003E图片\u003C\u002Fem\u003E本身的宽高哦),这里可以用GetSize程序获取:\n\nvar p = this.GetPos(), s = this.GetSize(p.Width, p.Height, this.viewWidth, this.viewHeight), scale = s.Height \u002F p.Height;\n\n其中GetSize获取尺寸程序可以根据\u003Cem\u003E图片\u003C\u002Fem\u003E实际大小按比例缩放到要\u003Cem\u003E设置\u003C\u002Fem\u003E的大小:\n\nCode\nvar iWidth = nowWidth, iHeight = nowHeight, scale = iWidth \u002F iHeight;\n\u002F\u002F按比例\u003Cem\u003E设置\u003C\u002Fem\u003E\nif(fixHeight){ iWidth = (iHeight = fixHeight) * scale; }\nif(fixWidth && (!fixHeight || iWidth \u003E fixWidth)){ iHeight = (iWidth = fixWidth) \u002F scale; }\n\u002F\u002F返回尺寸对象\nreturn { Width: iWidth, Height: iHeight }\n\n可以看出如果后两个参数(viewWidth和this.viewHeight)都不\u003Cem\u003E设置\u003C\u002Fem\u003E就会按原来大小\u003Cem\u003E显示\u003C\u002Fem\u003E了,\n\n然后再按预览图跟控制层的比例\u003Cem\u003E设置\u003C\u002Fem\u003E预览图的样式参数:\n\nvar pHeight = this._layBase.height * scale, pWidth = this._layBase.width * scale, pTop = o.Top * scale, pLeft = o.Left * scale;\n\n最后根据参数对预览对象进行样式\u003Cem\u003E设置\u003C\u002Fem\u003E和切割:\n\nCode\nwith(this._view.style){\n \u002F\u002F\u003Cem\u003E设置\u003C\u002Fem\u003E样式\n width = pWidth + \"px\"; height = pHeight + \"px\"; top = - pTop + \"px \"; left = - pLeft + \"px\";\n \u002F\u002F切割预览图\n clip = \"rect(\" + pTop + \"px \" + (pLeft + s.Width) + \"px \" + (pTop + s.Height) + \"px \" + pLeft + \"px)\";\n}\n\n这里有点烦乱,但应该不难理解就不详细说明了。\n\n【\u003Cem\u003E图片\u003C\u002Fem\u003E大小】\n\n容器的大小一般是固定的,但\u003Cem\u003E图片\u003C\u002Fem\u003E的大小就不是固定的,这里又可以使用SetSize程序用来\u003Cem\u003E设置\u003C\u002Fem\u003E\u003Cem\u003E图片\u003C\u002Fem\u003E大小:\n\nCode\nvar s = this.GetSize(this._tempImg.width, this._tempImg.height, this.Width, this.Height);\n\u002F\u002F\u003Cem\u003E设置\u003C\u002Fem\u003E底图和切割图\nthis._layBase.style.width = this._layCropper.style.width = s.Width + \"px\";\nthis._layBase.style.height = this._layCropper.style.height = s.Height + \"px\";\n\n有了\u003Cem\u003E图片\u003C\u002Fem\u003E大小就可以用来\u003Cem\u003E设置\u003C\u002Fem\u003E拖放和缩放的范围限制了:\n\nCode\nthis._drag.mxRight = s.Width; this._drag.mxBottom = s.Height;\nif(this.Resize){ this._resize.mxRight = s.Width; this._resize.mxBottom = s.Height; }\n\nps:程序中的Init程序是用来把个性\u003Cem\u003E设置\u003C\u002Fem\u003E呈现出来,所以一般\u003Cem\u003E设置\u003C\u002Fem\u003E过属性之后(例如\u003Cem\u003E图片\u003C\u002Fem\u003E地址、透明度等)就执行一次Init程序就可以\u003Cem\u003E显示\u003C\u002Fem\u003E效果了。\n\n【ie6渲染bug】\n\n在拖放效果中说到插入一个\u003Cem\u003Ediv\u003C\u002Fem\u003E解决ie的透明背景bug,这里就需要修复这个bug。\n跟缩放效果配合使用时,不得不说ie6的一个渲染bug,用下面的代码测试(ie6):\n\nCode\n\u003C!DOCTYPE html PUBLIC \"-\u002F\u002FW3C\u002F\u002FDTD XHTML 1.0 Transitional\u002F\u002FEN\" \"http:\u002F\u002Fwww.w3.org\u002FTR\u002Fxhtml1\u002FDTD\u002Fxhtml1-transitional.dtd\"\u003E\n\u003Chtml\u003E\n\u003Cbody\u003E\n\u003C\u003Cem\u003Ediv\u003C\u002Fem\u003E id=\"aa\" style=\"width:300px;height:100px;border:1px solid;\"\u003E\u003C\u003Cem\u003Ediv\u003C\u002Fem\u003E style=\"background:#00f;height:100%;\"\u003E\u003C\u002F\u003Cem\u003Ediv\u003C\u002Fem\u003E\u003E\u003C\u002F\u003Cem\u003Ediv\u003C\u002Fem\u003E\u003E\n\u003Cscript\u003EsetTimeout(\"aa.style.height=200\",0)\u003C\u002Fscript\u003E\n\u003C\u002Fbody\u003E\n\u003C\u002Fhtml\u003E\n\n可以对比ie7的效果,可以看出里面的\u003Cem\u003Ediv\u003C\u002Fem\u003E虽然高度\u003Cem\u003E设置\u003C\u002Fem\u003E了100%,但在外面的\u003Cem\u003Ediv\u003C\u002Fem\u003E修改高度之后,却不知什么原因没有填充了(外面的\u003Cem\u003Ediv\u003C\u002Fem\u003E渲染后,没有触发里面的\u003Cem\u003Ediv\u003C\u002Fem\u003E再渲染)。\n\n解决这个bug的关键是使里面的\u003Cem\u003Ediv\u003C\u002Fem\u003E能再渲染,这里有几个方法可以解决:\n1,\u003Cem\u003E设置\u003C\u002Fem\u003E控制层的overflow为hidden,好处是只需要\u003Cem\u003E设置\u003C\u002Fem\u003E一次,但这个样式会影响其他效果,当然在不影响效果的情况下这个是最好的方法;\n2,在缩放的时候,通过修改控制层的某些样式,使里面的\u003Cem\u003Ediv\u003C\u002Fem\u003E再渲染,这样的样式包括zoom,display(应该还有其他吧);\n3,在缩放的时候,通过修改插入\u003Cem\u003Ediv\u003C\u002Fem\u003E的某些样式,使其再渲染,这样的样式包括display(zoom也不行);\n程序中是通过修改_layHandle的zoom解决的:\n\nif(isIE6){ with(this._layHandle.style){ zoom = .9; zoom = 1; }; };\n\nps:这个bug的原因貌似跟ie的layout有关,但我查了一下还是没弄清楚,谁有详细的介绍或解析务必跟我分享一下啊。\n\n\n使用说明\n\n实例化时有三个必要参数:容器对象、控制层、\u003Cem\u003E图片\u003C\u002Fem\u003E地址:\n\nvar ic = new ImgCropper(\"bg\u003Cem\u003EDiv\u003C\u002Fem\u003E\", \"drag\u003Cem\u003EDiv\u003C\u002Fem\u003E\", \"1.jpg\");\n\n有以下这些可选参数和属性:\n属性:默认值\u002F\u002F说明\nOpacity: 50,\u002F\u002F透明度(0到100)\nColor: \"\",\u002F\u002F背景色\nWidth: 0,\u002F\u002F\u003Cem\u003E图片\u003C\u002Fem\u003E高度\nHeight: 0,\u002F\u002F\u003Cem\u003E图片\u003C\u002Fem\u003E高度\n\u002F\u002F缩放触发对象\nResize: false,\u002F\u002F是否\u003Cem\u003E设置\u003C\u002Fem\u003E缩放\nRight: \"\",\u002F\u002F右边缩放对象\nLeft: \"\",\u002F\u002F左边缩放对象\nUp: \"\",\u002F\u002F上边缩放对象\nDown: \"\",\u002F\u002F下边缩放对象\nRightDown: \"\",\u002F\u002F右下缩放对象\nLeftDown: \"\",\u002F\u002F左下缩放对象\nRightUp: \"\",\u002F\u002F右上缩放对象\nLeftUp: \"\",\u002F\u002F左上缩放对象\nMin: false,\u002F\u002F是否最小宽高限制(为true时下面min参数有用)\nminWidth: 50,\u002F\u002F最小宽度\nminHeight: 50,\u002F\u002F最小高度\nScale: false,\u002F\u002F是否按比例缩放\nRatio: 0,\u002F\u002F缩放比例(宽\u002F高)\n\u002F\u002F预览对象\u003Cem\u003E设置\u003C\u002Fem\u003E\nPreview: \"\",\u002F\u002F预览对象\nviewWidth: 0,\u002F\u002F预览宽度\nviewHeight: 0\u002F\u002F预览高度","createTime":"2009-05-20 22:56:19","dataReportQuery":"spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Paid-1-1332114-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default&depth_1-utm_source=distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Paid-1-1332114-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default","dataReportClick":"{\"mod\":\"popu_645\",\"index\":\"1\",\"dest\":\"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fxxd851116\u002F1332114\",\"strategy\":\"2~default~OPENSEARCH~Paid\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Paid-1-1332114-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","dataReportView":"{\"mod\":\"popu_645\",\"index\":\"1\",\"dest\":\"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fxxd851116\u002F1332114\",\"strategy\":\"2~default~OPENSEARCH~Paid\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Paid-1-1332114-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","type":"download"},{"url":"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fweixin_38608693\u002F14901969","title":"\u003Cem\u003EJS\u003C\u002Fem\u003E实现\u003Cem\u003E图片\u003C\u002Fem\u003E剪裁并预览效果","desc":"今天又疯狂学习了web前端的\u003Cem\u003E图片\u003C\u002Fem\u003E剪裁效果,可以有个\u003Cem\u003E区域\u003C\u002Fem\u003E来框住\u003Cem\u003E图片\u003C\u002Fem\u003E的某一\u003Cem\u003E部分\u003C\u002Fem\u003E,并可以预览框住的\u003Cem\u003E部分\u003C\u002Fem\u003E \n\n效果图如下:\n\n\n看着是不是很炫呢\n\n简单介绍下实现方法吧\n\n1.布局就是左右两块\u003Cem\u003Ediv\u003C\u002Fem\u003E,右边的好说,主要是左边的,左边的用绝对布局的方式分了3层,最下面一层是一个半透明的\u003Cem\u003E图片\u003C\u002Fem\u003E,中间一层是原图,但被剪切成只有一块,也只\u003Cem\u003E显示\u003C\u002Fem\u003E这一块,可以用clip:rect方法实现,然后最上面一层就是自己写的一个边框,在边框上加了8个点,分别给这8个点定义位置。 \n2.然后\u003Cem\u003EJS\u003C\u002Fem\u003E代码用了鼠标的点击事件来实现。 \n下面贴上自己的代码:\n\nindex.html (这里要引用两个\u003Cem\u003Ejs\u003C\u002Fem\u003E文件,分别是jquery和jquery","createTime":"2021-01-21 11:31:51","dataReportQuery":"spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Rate-2-14901969-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default&depth_1-utm_source=distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Rate-2-14901969-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default","dataReportClick":"{\"mod\":\"popu_645\",\"index\":\"2\",\"dest\":\"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fweixin_38608693\u002F14901969\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Rate-2-14901969-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","dataReportView":"{\"mod\":\"popu_645\",\"index\":\"2\",\"dest\":\"https:\u002F\u002Fdownload.csdn.net\u002Fdownload\u002Fweixin_38608693\u002F14901969\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-download-2~default~OPENSEARCH~Rate-2-14901969-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","type":"download"},{"url":"https:\u002F\u002Fblog.csdn.net\u002Fqq_38188485\u002Farticle\u002Fdetails\u002F80949039","title":"\u003Cem\u003E图片\u003C\u002Fem\u003E溢出\u003Cem\u003Ediv\u003C\u002Fem\u003E,超出\u003Cem\u003Ediv\u003C\u002Fem\u003E解决办法","desc":"当我的\u003Cem\u003E图片\u003C\u002Fem\u003E宽度大小没有\u003Cem\u003E设置\u003C\u002Fem\u003E,过大的时候,它会超出我的\u003Cem\u003Ediv\u003C\u002Fem\u003E宽度。这个时候,我给它\u003Cem\u003E设置\u003C\u002Fem\u003E了一个小于我的\u003Cem\u003Ediv\u003C\u002Fem\u003E的宽度,它是可以进入\u003Cem\u003Ediv\u003C\u002Fem\u003E盒子而不溢出的,然而,当我们的浏览器缩小的时候,我的\u003Cem\u003Ediv\u003C\u002Fem\u003E是栅格布局,固定了百分比会随浏览器可视界面而缩小,但是此时\u003Cem\u003E图片\u003C\u002Fem\u003E因为固定宽度不能同步缩小,还是会发生溢出现象。还有一种将就的办法,就是\u003Cem\u003E设置\u003C\u002Fem\u003Eoverflow:hidden,隐藏溢出的\u003Cem\u003E部分\u003C\u002Fem\u003E,但是大家都可以预料的到那种糟...","createTime":"2018-07-07 10:14:50","dataReportQuery":"spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-3-80949039-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default&depth_1-utm_source=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-3-80949039-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default","dataReportClick":"{\"mod\":\"popu_645\",\"index\":\"3\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fqq_38188485\u002Farticle\u002Fdetails\u002F80949039\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-3-80949039-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","dataReportView":"{\"mod\":\"popu_645\",\"index\":\"3\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fqq_38188485\u002Farticle\u002Fdetails\u002F80949039\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-3-80949039-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","type":"blog"},{"url":"https:\u002F\u002Fblog.csdn.net\u002Fhanyue198528\u002Farticle\u002Fdetails\u002F4210622","title":"JavaScript传说中的\u003Cem\u003E图片\u003C\u002Fem\u003E截取(只\u003Cem\u003E显示\u003C\u002Fem\u003E一张\u003Cem\u003E图片\u003C\u002Fem\u003E的某个\u003Cem\u003E部分\u003C\u002Fem\u003E)","desc":"我们需要截取\u003Cem\u003E图片\u003C\u002Fem\u003E的一\u003Cem\u003E部分\u003C\u002Fem\u003E(也就是把\u003Cem\u003E图片\u003C\u002Fem\u003E的其他\u003Cem\u003E部分\u003C\u002Fem\u003E隐藏)我们可以把这张\u003Cem\u003E图片\u003C\u002Fem\u003E放到一个\u003Cem\u003E层中\u003C\u002Fem\u003E,通过控制层的大小从而控制将要\u003Cem\u003E显示\u003C\u002Fem\u003E的\u003Cem\u003E区域\u003C\u002Fem\u003E大小,样式如下\u003Cem\u003Ediv\u003C\u002Fem\u003E{    position:absolute;    width:32px; \u002F\u002F宽度    height:48px;\u002F\u002F高度    overflow:hidden;\u002F\u002F其他\u003Cem\u003E部分\u003C\u002Fem\u003E隐藏   } 然后在函数(function)里通过scro","createTime":"2009-05-23 13:21:00","dataReportQuery":"spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-4-4210622-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default&depth_1-utm_source=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-4-4210622-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default","dataReportClick":"{\"mod\":\"popu_645\",\"index\":\"4\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fhanyue198528\u002Farticle\u002Fdetails\u002F4210622\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-4-4210622-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","dataReportView":"{\"mod\":\"popu_645\",\"index\":\"4\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fhanyue198528\u002Farticle\u002Fdetails\u002F4210622\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-4-4210622-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","type":"blog"},{"url":"https:\u002F\u002Fblog.csdn.net\u002Fweixin_30363285\u002Farticle\u002Fdetails\u002F117831917","title":"html选择\u003Cem\u003E区域\u003C\u002Fem\u003E高亮,css+\u003Cem\u003Ejs\u003C\u002Fem\u003E实现\u003Cem\u003E部分\u003C\u002Fem\u003E\u003Cem\u003E区域\u003C\u002Fem\u003E高亮可编辑遮罩层","desc":"想大家都做过遮罩层这种常见的功能,css或jquery实现,实现方式多样化,这里http:\u002F\u002F我介绍我在项目中实现的方式,全屏遮罩,\u003Cem\u003E部分\u003C\u002Fem\u003E\u003Cem\u003E区域\u003C\u002Fem\u003E可操作,非常实用。效果如下图:\u003Cem\u003Ejs\u003C\u002Fem\u003E 实现\u003Cem\u003E部分\u003C\u002Fem\u003E:var myAlert = document.getElementById(\"alert\");var reg = document.getElementById(\"content\").getElementsByT...","createTime":"2021-06-12 02:49:05","dataReportQuery":"spm=1035.2023.3001.6557&utm_medium=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-5-117831917-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default&depth_1-utm_source=distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-5-117831917-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default","dataReportClick":"{\"mod\":\"popu_645\",\"index\":\"5\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fweixin_30363285\u002Farticle\u002Fdetails\u002F117831917\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-5-117831917-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","dataReportView":"{\"mod\":\"popu_645\",\"index\":\"5\",\"dest\":\"https:\u002F\u002Fblog.csdn.net\u002Fweixin_30363285\u002Farticle\u002Fdetails\u002F117831917\",\"strategy\":\"2~default~OPENSEARCH~Rate\",\"extra\":\"{\\\"utm_medium\\\":\\\"distribute.pc_relevant_bbs_down_v2.none-task-blog-2~default~OPENSEARCH~Rate-5-117831917-bbs-110014715.264^v3^pc_relevant_bbs_down_v2_default\\\",\\\"dist_request_id\\\":\\\"1711653618430_11132\\\"}\",\"spm\":\"1035.2023.3001.6557\"}","type":"blog"}],"staffDOList":[{"id":null,"communityId":209,"username":"community_91","userNickname":"JavaScript","roleCode":1,"status":1,"createUsername":"","updateUsername":"","avatarUrl":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002Fdefault.jpg!1","createTime":"2021-05-12 18:07:03","updateTime":"2021-05-12 18:07:03","lastLoginTime":"2021-05-12 18:07:03"},{"id":null,"communityId":209,"username":"sysdzw","userNickname":"无·法","roleCode":2,"status":1,"createUsername":"community_91","updateUsername":"","avatarUrl":"https:\u002F\u002Fprofile-avatar.csdnimg.cn\u002F45dcec50fd694b578374e7167ff7914a_sysdzw.jpg!1","createTime":"2021-06-16 17:59:42","updateTime":"2021-06-16 17:59:42","lastLoginTime":"2021-06-16 17:59:42"}],"communityConfig":{"scoreType":0,"scoreItems":{"0":"给本帖投票","1":"锋芒小试,眼前一亮","2":"潜力巨大,未来可期","3":"持续贡献,值得关注","4":"成绩优异,大力学习","5":"贡献巨大,全力支持"}},"shouldApply":false,"subscribeAble":false,"operatorAble":false,"commentNeedJoinCommunity":false},"default2014LiveRoom":[{"itemType":"","description":"高峰论坛","title":"2022 技术英雄会","url":"https:\u002F\u002Flive.csdn.net\u002Froom\u002Fiframe\u002Fcsdnnews\u002FfsNR5NWp?chat=1&title=1&footer=1","images":["https:\u002F\u002Fimg-home.csdnimg.cn\u002Fimages\u002F20221016050009.png"],"ext":{"time":"9:00","liveRoomUrl":"https:\u002F\u002Flive.csdn.net\u002Froom\u002Fcsdnnews\u002FfsNR5NWp"}}]},"isGooglebot":false,"canonical":"https:\u002F\u002Fwww.csdn.net\u002Ftopics\u002F110014715","openUrl":"","isApp":false,"localUrl":"https:\u002F\u002Fbbs.csdn.net\u002Ftopics\u002F110014715","typeId":"index","hasIndex":false},"CFG":{"ALIPLAYER_VERSION":"v4","ALIPLAYER_H5_VERSION":"mobile_v1","ENV":"prod","ROOT_URL":"https:\u002F\u002Fcms-mall.csdn.net\u002F","VUE_APP_API_URL_SERVER":"http:\u002F\u002Fcms-community-api.internal.csdn.net\u002F","VUE_APP_API_URL":"https:\u002F\u002Fcms-api.csdn.net\u002F","LOGIN_URL":"https:\u002F\u002Fpassport.csdn.net\u002Faccount\u002Flogin","VUE_APP_DOMAIN_SKILL":"https:\u002F\u002Fedu.csdn.net\u002F","VUE_APP_DOMAIN_PATH":"https:\u002F\u002Fedu.csdn.net\u002F","VUE_APP_COMMUNITY_API_URL":"https:\u002F\u002Fcommunity-api.csdn.net\u002F","VUE_APP_CCLOUD_API_URL":"https:\u002F\u002Fbizapi.csdn.net\u002Fcommunity-cloud\u002Fv1\u002F","VUE_APP_SKILL_API_URL":"https:\u002F\u002Fbizapi.csdn.net\u002Fskilltree\u002Fapi\u002F","VUE_APP_SEARCH_PLUGIN_API_URL":"https:\u002F\u002Fbizapi.csdn.net\u002Fsearchplugin\u002F","VUE_APP_COMMUNITY_ASK_API_URL":"https:\u002F\u002Fmp-ask.csdn.net\u002F","VUE_APP_ME_URL":"https:\u002F\u002Fme.csdn.net\u002F","VUE_APP_CCLOUD_RESUME":"https:\u002F\u002Fbizapi.csdn.net\u002Fjob-api\u002F","VUE_APP_CCLOUD_MAIN":"https:\u002F\u002Fwww.csdn.net\u002F","VUE_APP_CCLOUD_UC":"https:\u002F\u002Fwww.csdn.net\u002F","VUE_APP_CCLOUD_BZP_API_URL":"https:\u002F\u002Fbizapi.csdn.net\u002F","VUE_APP_CCLOUD_START_API_URL":"https:\u002F\u002Fmp-action.csdn.net\u002F","VUE_APP_PRACTIVE":"https:\u002F\u002Fbizapi.csdn.net\u002Fdaily-practice\u002F","VUE_APP_CCLOUD_HOSTPATH":"https:\u002F\u002Fbbs.csdn.net\u002F"},"queries":{"pageId":[],"domain":["ccloud.csdn.net\u002Fccloud\u002Fdetail1"],"id":["110014715"],"deviceType":"pc","isSpider":"","hostname":["bbs.csdn.net"]},"basePath":"bbs.csdn.net\u002Fccloud\u002Ftopics\u002F110014715","hrefUrl":"https:\u002F\u002Fbbs.csdn.net\u002Ftopics\u002F110014715","active":0,"navBarFixed":false,"title":"js如何设置 DIV层中的图片 部分区域显示","isLive":false,"contentType":{"text":"text","picture":"picture","link":"link","video":"video","vote":"vote","live":"live","blog":"blog","long_text":"long_text","task_text":"task_text"},"liveUrl":"https:\u002F\u002Flive.csdn.net\u002Froom\u002Fiframe\u002F","spmExtra":{"id":209,"topicId":110014715},"keywords":"","description":"以下内容是CSDN社区关于js如何设置 DIV层中的图片 部分区域显示相关内容,如果想了解更多关于JavaScript社区其他内容,请访问CSDN社区。"}; 可以对比ie7的效果,可以看出里面的div虽然高度设置了100%,但在外面的div修改高度之后,却不知什么原因没有填充了(外面的div渲染后,没有触发里面的div再渲染)。 解决这个bug的关键是使里面的div能再渲染,这里有几个方法可以解决: 1,设置控制层的overflow为hidden,好处是只需要设置一次,但这个样式会影响其他效果,当然在不影响效果的情况下这个是最好的方法; 2,在缩放的时候,通过修改控制层的某些样式,使里面的div再渲染,这样的样式包括zoom,display(应该还有其他吧); 3,在缩放的时候,通过修改插入div的某些样式,使其再渲染,这样的样式包括display(zoom也不行); 程序中是通过修改_layHandle的zoom解决的: if(isIE6){ with(this._layHandle.style){ zoom = .9; zoom = 1; }; }; ps:这个bug的原因貌似跟ie的layout有关,但我查了一下还是没弄清楚,谁有详细的介绍或解析务必跟我分享一下啊。 使用说明 实例化时有三个必要参数:容器对象、控制层、图片地址: var ic = new ImgCropper("bgDiv", "dragDiv", "1.jpg"); 有以下这些可选参数和属性: 属性:默认值//说明 Opacity: 50,//透明度(0到100) Color: "",//背景色 Width: 0,//图片高度 Height: 0,//图片高度 //缩放触发对象 Resize: false,//是否设置缩放 Right: "",//右边缩放对象 Left: "",//左边缩放对象 Up: "",//上边缩放对象 Down: "",//下边缩放对象 RightDown: "",//右下缩放对象 LeftDown: "",//左下缩放对象 RightUp: "",//右上缩放对象 LeftUp: "",//左上缩放对象 Min: false,//是否最小宽高限制(为true时下面min参数有用) minWidth: 50,//最小宽度 minHeight: 50,//最小高度 Scale: false,//是否按比例缩放 Ratio: 0,//缩放比例(宽/高) //预览对象设置 Preview: "",//预览对象 viewWidth: 0,//预览宽度 viewHeight: 0//预览高度

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧