JavaScript怎样做出一个画圆圈的效果啊,比如一张图片是一个小圆点,怎样让这个小圆点以20p

JavaScript023

JavaScript怎样做出一个画圆圈的效果啊,比如一张图片是一个小圆点,怎样让这个小圆点以20p,第1张

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>画圆</title>

<script src="http://apps.bdimg.com/libs/raphael/2.1.2/raphael-min.js"></script>

</head>

<body>

<div id="holder"></div>

<script>

var paper = Raphael( "holder", 400, 400 )

var circle = paper.circle(200, 200, 150)  // 从200,200 开始画一个半径150的圆

circle.attr("fill", "#f00") //并用红色填充

</script>

</body>

</html>

给你写了个Demo,你自己换成图片即可,但需要HTML5的支持。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">

<html>

<head>

<style type="text/css">

div {

width: 150px

height: 10px

position: absolute

top: 100px

left: 100px

background-color: #4265ac

}

</style>

</head>

<body>

<div id="div" onclick="if(running){stop()}else{start()}"></div>

</body>

<script type="text/javascript">

var running = false

var interval = undefined

function start() {

var rotate = 0

interval = setInterval(function() {

div.style.transform = "rotate(" + (rotate += 20) + "deg)"

}, 50)

running = true

}

function stop() {

clearInterval(interval)

running = false

}

</script>

</html>