<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body{
background:#CCC;
}
</style>
<script type="text/javascript">
function draw(){
var context = document.getElementById('box').getContext('2d');
var img = document.createElement('IMG');
img.onload = function () {
context.save();
context.beginPath();
context.moveTo(195, 70);
context.lineTo(230, 80);
context.lineTo(270, 120);
context.lineTo(350, 130);
context.lineTo(380, 160);
context.lineTo(440, 180);
context.lineTo(470, 250);
context.lineTo(400, 270);
context.lineTo(240, 275);
context.lineTo(210, 270);
context.lineTo(160, 260);
context.lineTo(150,180);
context.lineTo(180,150);
context.closePath();
context.clip();
context.drawImage(img, 0, 0);
context.restore();
}
img.src = "images/img3.jpg";
}
window.onload = draw;
</script>
<title>Clipping Canvas Element</title>
</head>
<body>
<canvas id="box" width="500" height="350"></canvas>
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
Clipping Canvas Element - Polygon.zip
共3个文件
jpg:2个
html:1个
0 下载量 160 浏览量
2023-11-08
19:37:46
上传
评论
收藏 50KB ZIP 举报
温馨提示
JavaScript
资源推荐
资源详情
资源评论
收起资源包目录
Clipping Canvas Element - Polygon.zip (3个子文件)
clipping_polygon_js
screenshot.jpg 23KB
index.html 1011B
images
img3.jpg 32KB
共 3 条
- 1
资源评论
sanbaofengs
- 粉丝: 507
- 资源: 711
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功