地址是
http://codepen.io/fishenal/full/EDxGL

主要用到了raphael.js来画svg,实现很简单,分享如下

var paper = Raphael(0, 0, 1000, 1000)

var Ball = function(x, y, r){
  this.x = x
  this.y = y
  this.r = r
  this.init = function(){
    var me = this;
    this.tball = paper.circle(me.x, me.y, me.r).attr('fill', '#000')
    this.tball.click(function(){
      me.tball.remove()
      var x = [new Ball(me.x - me.r/2, me.y - me.r/2, me.r/2),
               new Ball(me.x - me.r/2, me.y + me.r/2, me.r/2),
               new Ball(me.x + me.r/2, me.y - me.r/2, me.r/2),
               new Ball(me.x + me.r/2, me.y + me.r/2, me.r/2)]

      })
  }

  this.init();
}

var ball = new Ball(300, 300, 300);

一个圆,中心点x,y坐标,半径r
给自己绑定一个点击事件,删除自己,创建四个新圆,中心点位置分别是当前+- 半径/2,四种组合,半径设为一半


fishenal
3.4k 声望159 粉丝

千山鸟飞绝万径人踪灭