麻烦老师来解决一下我的疑问。
来源:6-2 上升到面向对象-炫彩小球小案例
weixin_慕移动6442865
2020-12-05 15:34:21
问题1: 请问老师,为什么这里的宽高要在JS里设置,而不在style里直接设置呢??
this.dom.style.width=this.r*2+'px'
this.dom.style.height=this.r*2+'px'
问题2:为什么这里left和top值必须圆心减半径???只是为了起始从左上角吗??不是很明白。
this.dom.style.left=this.x-this.r+'px'
this.dom.style.top=this.y-this.r+'px'
2回答
同学你好,不减去小圆的半径,实现的效果确实没有多大的差别。但是从老师上一条回答中的分析可知,因为小圆距离页面的距离是从小圆的边框处开始计算的,而不是从圆心开始计算,所以必须要减去小圆的半径,代码才会更加规范与严谨。当然了,同学如果不考虑这些,自己练习时减不减去this.r都是可以的,但是老师更推荐同学按着老师的写法减去小圆的半径this.r,保持严谨
祝学习愉快~
好帮手慕慕子
2020-12-05
同学你好, 对于你的问题解答如下:
因为直接style里面设置的样式是固定的,但是实际要实现的效果,小彩球的宽高,在鼠标移动过程中宽高是要发生变化的,并不是一个固定的值,所以要通过js设置。
是的,因为小圆距离页面的距离是从小圆的边框处开始计算的,而不是从圆心开始计算,所以必须减去小圆的半径。
老师以水平方向为例,简单画了一个图,帮助同学更好的理解,垂直方向是相同的道理,如下图所示:
祝学习愉快~
相似问题