css截图

来源:互联网 发布:中国工业软件网网址 编辑:程序博客网 时间:2024/05/24 06:43

css截图

代码:<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">


</style>
<script type="text/javascript">
var i=0;
window.onload=function(){
document.onclick=function(){
var playerImg=document.getElementById("playerImg");
        playerImg.style.clip="rect(0px "+(i+1)*30+"px 30px "+i*30+"px";
playerImg.style.left=20-i*30+"px";
i++;


}


}


</script>


</head>




<body>
<div style="position:absolute;left:100px;top:100px;width:400px;height:300px;border:1px solid blue">
<img id="playerImg" src="9597ab5c14ad31d6b574c2f7856b6c8e.jpg" style="position:absolute;left:20px;top:5px;clip: rect(0px 180px 90px 130px)"/>
aaaaaaaaaaaaaaaaaaaaaaaa
</div>
</body>
</html>

结果:

0 0
原创粉丝点击