资讯专栏INFORMATION COLUMN

JS基础入门篇(十四)—运动

tain335 / 2039人阅读

摘要:直到盒子的宽度大于或着等于。将思路二封装成函数,使的每个元素都可以使用。例如还改变盒子的高度值,可以改变传入的参数值。页面中哪个元素元素的哪个属性每个周期改变多少元素的目标值有时候需要在规定时间完成宽的变大或者变小。

1.思考:页面上有一个宽高都为100px的盒子,如果想点击此盒子,让它的宽变成300px,应该怎么做 ?

思路一:选择用js的点击事件做,给盒子添加类名,并在类名中写对应的css样式。




    
    Title
    


    

思路二:使用定时器做,让盒子的宽度每20毫秒加5px。直到盒子的宽度大于或着等于300px。




    
    Title
    


    

将思路二封装成函数,使的每个元素都可以使用。例如还改变盒子的高度值,可以改变传入的参数值。

2.有时候需要在规定时间完成宽的变大或者变小。
例如需要在2秒完成,盒子从宽100px到0




    
    Title
    


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52415.html

相关文章

  • JS基础入门十四)—运动

    摘要:直到盒子的宽度大于或着等于。将思路二封装成函数,使的每个元素都可以使用。例如还改变盒子的高度值,可以改变传入的参数值。页面中哪个元素元素的哪个属性每个周期改变多少元素的目标值有时候需要在规定时间完成宽的变大或者变小。 1.思考:页面上有一个宽高都为100px的盒子,如果想点击此盒子,让它的宽变成300px,应该怎么做 ? 思路一:选择用js的点击事件做,给盒子添加类名,并在类名中写对应...

    xumenger 评论0 收藏0
  • JS基础入门十四)—运动

    摘要:直到盒子的宽度大于或着等于。将思路二封装成函数,使的每个元素都可以使用。例如还改变盒子的高度值,可以改变传入的参数值。页面中哪个元素元素的哪个属性每个周期改变多少元素的目标值有时候需要在规定时间完成宽的变大或者变小。 1.思考:页面上有一个宽高都为100px的盒子,如果想点击此盒子,让它的宽变成300px,应该怎么做 ? 思路一:选择用js的点击事件做,给盒子添加类名,并在类名中写对应...

    dongxiawu 评论0 收藏0
  • JS基础入门(二十四)—DOM(下)

    摘要:到定位父级节点的距离返回值是一个对象,包含了元素盒模型的详细信息可视大小取对象中详细的属性值相对于浏览器可视区域。移入移出效果移入当前数字,数字的前后背景变色。 1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. Title div{ padding...

    bladefury 评论0 收藏0
  • JS基础入门(二十四)—DOM(下)

    摘要:到定位父级节点的距离返回值是一个对象,包含了元素盒模型的详细信息可视大小取对象中详细的属性值相对于浏览器可视区域。移入移出效果移入当前数字,数字的前后背景变色。 1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. Title div{ padding...

    SmallBoyO 评论0 收藏0
  • JS基础入门(三十四)— 面向对象(一)

    摘要:对象对象的定义对象是由键值对组成的无序集合。创建对象两种方法方法一字面量方法方法二构造函数创建面向对象和面向过程的比较如果想要把大象放进冰箱。 1.对象 对象的定义 : 对象 是 由 键值对 组成的无序集合。 创建对象两种方法 : 方法一 : 字面量方法 var obj = {name: k}; 方法二 : new Object( ) 构造函数创建 var a = n...

    fantix 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<