用JavaScript实现图片剪切效果_技术问答_慕课网

首页免费课用JavaScript实现图片剪切效果问答

用JavaScript实现图片剪切效果

全部评论问答未解决精华

前端小小小小小小白

66666666

0 3-7 JavaScript实现控制触点（下）

2017-09-03

按照老师的思路，按照自己的方式实现了一遍，目前遇到的问题就是如何设置截取范围的最大值与最小值

最赞回答 / 氽氽

目前遇到的问题就是如何设置截取范围的最大值与最小值

1 回答 1062 浏览 3-9 JavaScript实现选框区域明亮显示

2017-08-24

img2.style.clip="rect("+top+"px,"+right+"px,"+bottom+"px,"+left+"px)";

最新回答 / 愁晴

top的值是变化的，并且是数字，所以只能用字符串拼接

1 回答 859 浏览 3-9 JavaScript实现选框区域明亮显示

2017-08-21

前端_小小白

用transform: translate(-50%,-50%);
替换掉margin-left：-4px，top：-4px；
个人感觉更好

1 2-3 CSS实现图片控制触点效果

2017-08-08

慕粉0933205784

还以为可以通过js对图片进行裁剪处理然后再上传的。原来只是效果没有功能，但为老师的原生精神点赞！

0 1-1 JavaScript实现图片剪切效果课程简介

2017-08-03

拖拽事件函数不知道为什么改前和改后效果不一样，改前一卡一卡的，改了之后就很顺畅了

最新回答 / 慕婉清1496524

因为图片在拖动的时候被选中了，可以在css中禁止图片被选中-moz-user-select: none;-webkit-user-select:none;-ms-user-select:none;user-select:none;

1 回答 870 浏览 3-12 编程挑战

2017-08-02

问个问题，为什么会溢出，就是上面的触点以及下面的触点如果拉过头了它会带动其他的边一起移动，怎么修改好一点

已采纳回答 / 氽氽

mainDiv.style.height ,mainDiv.style.width 这两个值要对他们做限制，不能小于0，不能大于mainDive的宽高

1 回答 1136 浏览 3-7 JavaScript实现控制触点（下）

2017-08-01

笑出强大_0

哦~标题就是用javascript实现图片剪切效果，又没说是实现图片剪切~~~

0

2017-07-25

笑出强大_0

所以，截图呢？只是显示了需要截取的部分，怎么截下来呀

1 3-12 编程挑战

2017-07-25

笑出强大_0

margin-left：-4px，top：-4px；

1 2-3 CSS实现图片控制触点效果

2017-07-24

qq_咖啡男孩_04137871

听是听得懂，但真正做起来有点难度

0 3-5 JavaScript实现控制触点（中）

2017-07-20

慕码人0947380

但是老师的源码没错误，我自己写的时候总有bug，边框乱动；

0 3-5 JavaScript实现控制触点（中）

2017-07-18

qq_魔魔_0

貌似有个bug。从左边框向右拖动，会将整个框拖到外边去从上边框向下拖动，会将整个框拖到外边去

0

2017-07-10

Spiritual_stone

貌似有个bug。从左边框向右拖动，会将整个框拖到外边去

0 2-1 CSS实现图片不透明及裁剪效果

2017-06-02

慕粉4400782

heightBefore=mainDiv.offsetHeight-4;或者 heightBefore=mainDiv.clientHeight; 不然拖动时边框会跟着走

6 3-5 JavaScript实现控制触点（中）

2017-05-24

德坤

自己画一个正方形加上坐标系，里面再画一个小正方形，就懂了

0 2-2 练习题

2017-05-05

首页上一页 1 2 3 4 5 6 7 下一页尾页

该课程已下架

课程须知: 在学习本课程之前，您应该已经熟悉js事件的绑定和css的绝对定位。

老师告诉你能学到什么？: 通过本课程，您将学习到如何通过组合鼠标的按下、拖动和松开事件来实现鼠标对元素的拖动和缩放，从而在js事件操作方面的学习有个更大的飞越。

微信扫码，参与3人拼团

意见反馈帮助中心 APP下载

友情提示：

您好，此课程属于迁移课程，您已购买该课程，无需重复购买，感谢您对慕课网的支持！

查看已购买的课程

本次提问将花费2个积分

你的积分不足，无法发表

为什么扣积分？

确认取消

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分？

确认取消

举报

0/150

提交

取消