js推拉门效果的实现

这次给大家带来js推拉门效果的实现,js推拉门效果实现的注意事项有哪些,下面就是实战案例,一起来看一下。

  1. // JavaScript Documentfunction startMove(obj,json,endFn){clearInterval(obj.timer);obj.timer = setInterval(function(){var bBtn = true;for(var attr in json){var iCur = 0;if(attr == 'opacity'){if(Math.round(parseFloat(getStyle(obj,attr))*100)==0){iCur = Math.round(parseFloat(getStyle(obj,attr))*100);}else{iCur = Math.round(parseFloat(getStyle(obj,attr))*100) || 100;}}else{iCur = parseInt(getStyle(obj,attr)) || 0;}var iSpeed = (json[attr] - iCur)/8;iSpeed = iSpeed >0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);if(iCur!=json[attr]){bBtn = false;}if(attr == 'opacity'){obj.style.filter = 'alpha(opacity=' +(iCur + iSpeed)+ ')';obj.style.opacity = (iCur + iSpeed)/100;}else{obj.style[attr] = iCur + iSpeed + 'px';}}if(bBtn){clearInterval(obj.timer);if(endFn){endFn.call(obj);}}},30);}function getStyle(obj,attr){if(obj.currentStyle){return obj.currentStyle[attr];}else{return getComputedStyle(obj,false)[attr];}}

登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

js使用正则进行密码强度验证

js实现标签点击切换代码(附代码) 

以上就是js推拉门效果的实现的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    JQUERY通过当前标签名获取属性的值

    2025-3-8 12:47:16

    编程技术

    Vue Router+Vuex实现后退状态保存

    2025-3-8 12:47:21

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索