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

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

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

很多时候,我们都需要对图片进行裁剪、缩放、旋转等操作,比如:上传用户的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键来等比例裁剪图片;通过双击鼠标进入裁剪模式、移动模式等。

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

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

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

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

标签: 网站随笔

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

乌克兰安全研究人员吐槽 HackerOne 漏洞赏金平台不让提取资金

在俄乌冲突于 2 月下旬爆发后,许多西方国家都颁布了针对俄罗斯的制裁令。然而漏洞赏金平台 HackerOne 的做法,却让不少乌克兰安全研究人员也感到寒心。多位乌克兰黑客与研究人员在 Twitter 上控诉,HackerOne 正在阻止他们提取漏洞赏金,甚至有人被截留了数千美元。 由 Hacker...

俄乌冲突引发顾虑 五眼网络安全部门建议盟友增强关键基础设施防护

以美国为首的“五眼”网络安全部门,刚刚向其盟友(包括英国、加拿大、澳大利亚和新西兰)发出了关键网络基础设施的维护警告。美国家安全局(NSA)给出的理由是 —— 受俄罗斯支持的黑客组织,或对乌克兰境内外的组织构成更大的风险 —— 因而建议各组织对相关网络威胁保持高度警惕,并遵循联合咨询中提当过的缓解...

女子被控入侵飞行学校电脑系统 让需要维修的飞机起飞

据称,一名妇女入侵了佛罗里达州一家飞行培训学校的系统,删除并篡改了与该校飞机有关的信息。根据一份警方报告,在某些情况下,以前有维修问题的飞机被 “批准 “飞行。据该学校的首席执行官说,黑客攻击可能使飞行员处于危险之中。 这位名叫劳伦-利德的女性,曾经在墨尔本飞行培训学校工作,在2019年11月底,公...

Shutterfly 遭 Conti 勒索:数千台设备被加密 企业数据被窃取

摄影和个性化照片巨头 Shutterfly 近日遭到 Conti 的勒索软件攻击,据称该软件已经加密了数千台设备并窃取了企业数据。大约 2 周前,Shutterfly 遭受了 Conti 团伙的勒索软件攻击,他们声称已经加密了 4000 多台设备和 120 台 VMware ESXi 服务器。勒索软...

深入研究 Snake Keylogger 的新变种恶意软件

Fortinet 的 FortiGuard 实验室最近发现了一个用于传播恶意软件的微软 Excel 样本。在研究了它的行为之后,我发现它是 Snake Keylogger 恶意软件的一个新变种。 Snake Keylogger是一个模块化的`.NET`键盘记录器。它最早出现在2020年末,主要行为是...

Eufy 确认其服务器出现错误 让用户看到其他家庭的安全摄像头

昨晚,一些Eufy家庭安全摄像头的用户发现,由于一个明显的安全故障,他们能够访问其它家庭的智能摄像头的画面和从未见过的用户保存的视频。这个问题在Reddit的一个帖子中被曝光,来自世界各地的用户在其中详细描述了他们的经历。 “基本上我可以看到每一个摄像头,他们的前门和后门、主卧室、客厅、车库、厨房、...

评论列表

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

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

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

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

发表评论

访客

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