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

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

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

很多时候,我们都需要对图片进行裁剪、缩放、旋转等操作,比如:上传用户的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大流行的早期,在美国某些州,表达愤怒、厌恶或恐惧的与食品安全有关的推文与实际的食品不足密切相关。研究人员...

NVIDIA 拒绝支付赎金后 威胁者利用代码签署恶意软件 可在 Windows 中加载

利用窃取过来的 NVIDIA 代码,威胁者利用签名证书来签署恶意软件,使其看起来值得信赖,并允许在 Windows 中加载恶意驱动程序。本周,NVIDIA 公司证实,他们遭受了一次网络攻击,使威胁者得以窃取员工的证书和专有数据。 对本次泄露事件负责的勒索集团 Lapsus$ 表示,他们已经窃取了...

去年恶意勒索资金中有 74% 流向了俄罗斯有关黑客手中

一项新研究表明,2021 年通过勒索软件攻击方式牟取的所有资金中有 74% 流向了俄罗斯有关的黑客手中。研究人员说,价值超过 4 亿美元的加密货币支付给了“极有可能与俄罗斯有关联”的团体。研究人员还称,大量基于加密货币的洗钱活动是通过俄罗斯加密公司进行。 这项研究是由 Chainalysi...

YouTube上的 Valorant 骗局:RedLine 感染

Hackernews 编译,转载请注明出处: 韩国安全分析人士在YouTube上发现了一场恶意软件传播活动,攻击者使用Valorant当做诱饵,诱骗玩家下载RedLine——一个强大的信息窃取工具。 这种类型的滥用是相当普遍的,因为黑客发现绕过YouTube的新内容提交审核,或者在被举报和禁号时创...

疫情期间网络犯罪分子加大了攻击力度 首选支付方式是加密货币

利用新冠疫情,网络犯罪分子发起各种攻击而尽可能地牟利。欧盟网络安全机构 Enisa 强调,这类活动导致雇佣黑客在过去 15 个月中成为网络安全的最大威胁。 2020 年 4 月至 2021 年 7 月进行的研究的年度报告中,Enisa 表示 COVID-19 疫情期间观察到网络犯罪分子加大了针对潜在...

微软分享针对 Mac 的 UpdateAgent 复杂木马的细节

网络安全仍然是一个不断发展的领域,对威胁者和安全专家来说都是如此。尽管如此,最近产生的一个积极因素是,公司更愿意与合作伙伴、专家和更大的社区分享信息,共同应对威胁。这方面的一个例子是,微软与苹果合作修补macOS设备中的”Shrootless”漏洞。微软已经提供了有关一个针对Mac的复杂木马的详细信...

评论列表

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

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

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

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

发表评论

访客

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