html+css+js能不能做类似360的那种小球，在手机上运行的网页？

你是指下面这种小球吗？

这个是可以用jquery做的  它是一个jquery圆环统计插件circliful 来完成的

方法如下：

使用方法

<link href="css/jquery.circlify.css" rel="stylesheet" type="text/css" />

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

<script src="js/jquery.circliful.min.js"></script>

如果需要 fontawesome icons图片，请引入相关的CSS文件

将一个元素添加到页面中，并添加一个惟一的id值，并在data属性写上你需要的值，代码如下：

<div id="myStat" data-dimension="250" data-text="35%" data-info="New Clients" data-width="30" data-fontsize="38" data-percent="35" data-fgcolor="#61a9dc" data-bgcolor="#eee" data-fill="#ddd" data-total="200" data-part="35" data-icon="long-arrow-up" data-icon-size="28" data-icon-color="#fff"></div>

写入JS初始化插件

$( document ).ready(function() {

$('#myStat').circliful()

})

参数

dimension / 元素的高度与宽度 / 默认值 200px X 200px

text / 圆环内显示的文本

info /圆环内text文本下方的文字信息 ，可以为空

width / 圆环的大小 / 默认值 15px

fontsize /文本的字体大小 / 默认 15px

percent / 百分比，可以是1到100间的任意数值

fgcolor / 圆环的前景色 / 默认值 #556b2f

bgcolor / 圆环的背景色 / 默认值 #eee

fill / 整个圆环的背景色 ，可以为空

type / 全环或是半环，设计 data-type="half" 显示成半圆环 / 默认值 circle

total / 总量，百分比，比如你有 750MB 空间，  350MB 是使用的. 你就可以这样设置 data-total="750" 和 data-part="350" ，圆环将会显示成百分比 36,85%

part

border / 圆环的边框.

icon / Fontawesome icon

iconsize / icon的大小

iconcolor / icon的颜色

animationstep /动画的步阶, use 0 to disable animation, 0.5 to slow down, 2 to speed up, etc / default is 1

startdegree / 开始前景动的位置 / 默认值 0

bordersize / 边框的宽度

1：增加小球的业务，其逻辑我先例给你：

1.1：你说了，点击按钮，所以先写一个按钮，并绑定点击事件。

1.2：增加小球，那就必须要创建元素标签。其JS中的DOM方法是parent.createElement("div")

1.2：然后是追加给HTML文档中 方法是parent.appendChild(parent.createElement("div"))

1.3：之后就是定义样式。

2：上述中的parent，是其父级元素，在JS中创建一个元素或者删除一个元素必须要先找到其父级元素。jQuery有自删功能

3：对于以上还有哪里不明白或者有错误的地方，请追问，指正出来

4：望采纳

js:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawBeeline/demo1.js

html:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawBeeline/demo1.html

准备属性值：

   本文使用js画直线，运用到css中的一些属性。

绘制的步骤：

    在本例中，绘制直接使用鼠标。点击获得起始点，拖动到终点获得结束点，鼠标松开就绘制图形。

获得起始点：

获得结束点：

绘制直线：

    使用了jquery中的animate()方法。

   js:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawBall/demo2.js

   html:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawBall/demo2.html

小球的属性：

创建小球：

使小球运动：

    将之前的画直线的方法封装成一个固定起点和终点的类。

js:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawTrajectory/js/createLine.js

html:  https://github.com/wangxia34/trajectory/blob/master/trajectory/html_js/drawTrajectory/demo1.html

---