css3实现点击扩散效果

效果图

效果介绍:

点击省份所在的六边形时，以当前点击的六边形为中心，边框高亮显示并且实现向外扩散的效果

思路解析：

点击之后它六个边儿，然后每一个边儿的话，它往上走，一点点的这个描边儿，然后是周围的图片是没有高亮的，这样的话，直接用这个图片儿去实现就可以了，比如说把整张这个高亮的这个图就是以这个为中心，然后往右边儿扩散的，这个图儿整个扣下来，当你点击某一个的时候。你把他这个背景图直接替换成你这个高亮显示的这个描边儿图，然后他最好加一个过渡效果，那你这个时候可以用CSS给他加一个从中间往外扩散的一个，比如说宽度等于零，高度等于零，然后当你点击的时候，让他宽度乘百分百高度成百分百，从中间开始扩散就可以实现这种效果了。

在每一个这个小方块儿里面写一个元素，然后这个元素给他一个定位，让他聚到中间，就是上下左右都居中，然后当你点击这个方块儿的时候，然后让方块儿里面这个子元素让它膨胀，然后它的宽度和高度都有了，这样的话就有一个扩散的这个效果啦，然后可以在这个里面去给他加一个这个高亮的这个背景图