当前位置:首页 > 网站入侵 > 正文内容

js裁剪图片上传(js实现固定裁剪框)

访客3年前 (2022-01-25)网站入侵403

很多时候,我们都需要对图片进行裁剪、缩放、旋转等操作,比如:上传用户的LOGO,基本都需要裁剪功能的。那么一个好用的裁剪插件,势必会提高用户的体验度。

我们先来看一个裁剪图片,可能的效果和必须的功能,如下图:

从此图上,我们看出,四角可以拖拽缩放来裁剪,同时生产多张不同尺寸的小图,下边的功能按钮,还可以旋转图片、缩放、预览等。

上图如何实现呢?今天,推荐给您一款jQuery插件:Cropper.js。

那么什么是Cropper.js呢?

它是一个简单的jQuery图片裁剪插件。同样的,我们推荐用不依赖jQuery的Cropper.js库。

那么它有哪些特点呢?

支持jQuery1.9.1+的依赖、支持无jQuery的裁剪库;

支持38个配置选项、支持27个 *** 、支持6个事件;

支持移动端、支持缩放 旋转 等比缩放、支持多个裁剪;

支持在Canvas上裁剪、支持读取图片Exif信息、支持跨浏览器裁剪等。

那么如何获取它呢?

你可以到github上搜索:Cropper,它有2个版本,一个是依赖jQuery的,一个是不依赖jQuery的(Cropper.js)。推荐用不依赖的js库。

那么如何使用它呢?

通过上图,我们可以很快的用起来,至于配置信息,你可以到github上查阅。这里不一一列举了。

对于用户使用时,都有哪些常见问题?

比如:通过shift键来等比例裁剪图片;通过双击鼠标进入裁剪模式、移动模式等。

看着是不是很心动,有空就用一下吧,说不定哪天领导就让弄个这样的功能。不至于让我们手足无措。

扫描二维码推送至手机访问。

版权声明:本文由黑客技术发布,如需转载请注明出处。

本文链接:https://w-123.com/91074.html

标签: 网站随笔

“js裁剪图片上传(js实现固定裁剪框)” 的相关文章

研究人员通过人工智能利用推特预测粮食短缺问题

宾夕法尼亚州立大学和卡塔尔哈马德-本-哈利法大学的研究人员表示,推特上的推文所表达的情绪和情感可以被实时用来评估大流行病、战争或自然灾害供应链中断可能导致的粮食短缺。 他们发现,在COVID-19大流行的早期,在美国某些州,表达愤怒、厌恶或恐惧的与食品安全有关的推文与实际的食品不足密切相关。研究人员...

荷兰白帽黑客轻松攻破电网控制系统 捧走其第四座 Pwn2Own 奖杯

在本周于佛罗里达州迈阿密举办的 Pwn2Own 2022 大会上,两名来自荷兰的白帽黑客获得了第四次胜利。作为这场年度黑客大会的大赢家,Dean Keuper 和 Thijs Alkemade 获得了 90000 美元奖励、且捧走了冠军奖杯。此前这对搭档曾于 2012、2018 和 2021 年创下...

乌克兰安全局宣称逮捕了协助俄军开展通讯中继服务的黑客

Vice 报道称,在最近一次行动中,乌克兰安全局(SBU)声称抓获了一名在乌境内为俄军提供通信服务的黑客。在当天上午 10 点发布的推文和电报消息中,SBU 分享了本次行动的诸多细节。尽管尚未得到另一独立消息源的证实,但我们已经看到了面部打码的黑客、以及所谓的通信系统照片。 电报帖子指出,黑客...

Google Drive 开始向用户警告其托管的可疑文件

Google周四宣布,当用户打开托管在Google硬盘上的潜在可疑或危险文件时,它会开始警告用户。“我们将显示一个警告横幅,以帮助保护[用户]和他们的组织免受恶意软件、网络钓鱼和勒索软件的侵害。此前打开Google文档、表单、幻灯片和绘图时,已经有了这些警告。” 这次安全功能升级是完全被动的,管理...

因担心通风报信 FBI 暂缓公开 REvil 恶意软件的密钥

今年夏季 REvil 团伙发起了将近 3 周的大规模恶意软件攻击,美国联邦调查局(FBI)秘密扣留了密钥。该密钥本可以解密多达 1500 个网络上的数据和计算机,包括医院、学校和企业运营的网络。 援引华盛顿邮报报道,联邦调查局渗透了 REvil 团伙的服务器以获得该密钥。不过在和其他机构讨论之后,...

黑客拍卖 7000 万用户数据库后 AT&T 否认数据泄露

在一个知名黑客声称要出售一个包含7000万用户个人信息的数据库后,AT&T表示并没有遭遇数据泄露事件。这个被称为ShinyHunters的黑客昨天开始在一个黑客论坛上拍卖这个数据库,起价20万美元,递增报价3万美元。 该黑客表示,愿意立即以100万美元的价格出售。从该黑客分享的样本来看,该...

评论列表

南殷不矜
3年前 (2022-08-03)

个事件;支持移动端、支持缩放 旋转 等比缩放、支持多个裁剪;支持在Canvas上裁剪、支持读取图片Exif信息、支持跨浏览器裁剪等。那么如何获取它呢?你可以到github上搜索:Cropper,它有2个版本,一个是依赖j

孤央私野
3年前 (2022-08-03)

ub上查阅。这里不一一列举了。对于用户使用时,都有哪些常见问题?比如:通过shift键来等比例裁剪图片;通过双击鼠标进入裁剪模式、移动模式等。看着是不是很心动,有空就用一下吧,说不定哪天领导就让弄个这样的功能。不至于让我们手足无措。

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。