启发自 advanced DOM scripting ,觉得那个图片剪裁工具挺好玩的,但是它的代码我看不习惯,觉得面向对象不够彻底,然后我就有了一个更好玩的想法,就通宵把它的代码重构加强,并添加了一个图片部分自由放大的实现了,以往的图片部分放大,好像不能用户自己控制图片的放大程度,那个小框也不能改变大小。(参见京东商城,taobao)
。
先看效果图 (demo见附件):
javascript 使用方法:
var scaler_test_w=new Ext.ux.ImageScaler({
id:'scaler_test',
//弹出图片是原大小的多少
scaler:0.3,
//放大区域大小参考,根据和裁剪区域的比较倍数,等比例调整
scalerViewerWidth:600,
scalerViewerHeight:400
});
Ext.get('scaler_test_a').on('click',function(evt){
scaler_test_w.show();
evt.stopEvent();
});
只需要一个 img 标签
<a href='#' id='scaler_test_a'><img src='mm.jpg' width='300' height='450' id='scaler_test'
alt='test' /></a>
/*
v1.5 稳定了,调整放大算法,剪裁区域和弹出窗口都是等比例拖放,
根据放大窗口和剪裁区域的大小比设制放大窗口内最终放大图片的大小
*/
- 大小: 357.8 KB
- 大小: 368.2 KB
- 大小: 348 KB
- 大小: 401.2 KB
- 大小: 365.1 KB
- 大小: 542.7 KB
分享到:
相关推荐
ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0ext-2.0
ext-core-3.0.0ext-core-3.0.0ext-core-3.0.0ext-core-3.0.0
基于ext-core的ajax自动保存功能
spketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-ext-2.1.mxpspketdwcs-...
包括了ext-air-3.1.0和ext-core-3.1.0
Ext-Core 3.1.0 简体中文手册Ext-Core 3.1.0 简体中文手册Ext-Core 3.1.0 简体中文手册Ext-Core 3.1.0 简体中文手册Ext-Core 3.1.0 简体中文手册
bcprov-ext-jdk15on-1.68.jar
ext-ms-win-gdi-desktop-l1-1-0.dll 用于解决这个dll文件丢失问题,下载后将此文件放置在相关文件根目录下,即可解决丢失问题
前端开源库-style-ext-html-webpack-pluginStyleExtHTML Webpack插件,通过启用内嵌样式增强HTML Webpack插件功能。
ext 是 ExtJs 的简称,是一个强大的js 类库。本资源主要包括三个大的文件ext-all.css,ext-base.js,ext-al.js。在引用ext 类库的时候,这三个文件必不可少。另外我还提供了ext2的一个简单例子,以便大家学习交流。
ext-7.0.0-gpl.zip
1.下载 bcprov-ext-jdk15on-160.jar,复制到jdk_home\jre\lib\ext 2.配置bcprov,在 jdk_home\jre\lib\security\目录中找到 java.security 在内容增加一行 security.provider.11=org.bouncycastle.jce.provider....
bcprov-ext-jdk16-1.45.jar资源包 ,在进行JAVA的ECC椭圆算法调用时,需要用到的jar包
ext-3.3.1ext-3.3.1ext-3.3.1ext-3.3.1ext-3.3.1ext-3.3.1
2.将下载的两个JAR文件复制到:JDK安装目录\jre\lib\ext下,例如我的就是D:\Program Files (x86)\java\JDK1.6\jre\lib\ext 3.打开java.security文件:在JDK安装目录\jre\lib\security下的java.security文件。
ext-4.2.1-gpl.7z
bcprov-ext-jdk15on-1.54.jar和bcprov-jdk15on-1.54.jar压缩文件
ext-js-4.2框架ext-js-4.2框架ext-js-4.2框架ext-js-4.2框架
bcprov-ext-jdk15on-164.jar:支持java5-11。将jar包放置在%java_home%/jre/lib/ext目录。
从spket IDE 官网下载。 文件名: ext-4.2.1.883.jsb2 对应版本ext-4.2.*版本。spket自动提示ExtJs4,需要ext4.2.1.jsp2文件。