当前位置： 首页 > article >正文

css: 针对属性left/right/top/bottom为啥设置transition动画不起作用

article 2025/2/21 9:20:56

如题：
在css的position中 left/right/top/bottom 这类位置属性值如果考虑使用transition来添加动画，transition它会优先考虑left/top属性，而此时transition触发需要的是数值型属性，如果设置为'auto'则系统会默认不考虑将位置属性添加到动画transition中，即代码：

     draggableDiv.value.style.left = 'auto'
     draggableDiv.value.style.right = '0px'

不会生效，如果想让动画生效需要修改为：

	draggableDiv.value.style.left = window.innerWidth - divWidth + 'px';

即保留数值型位置值


http://www.kler.cn/a/546250.html

相关文章：

  • 企业文件共享中的权限管理与安全风险防范
  • 渗透利器：Burp Suite 联动 XRAY 图形化工具.（主动扫描+被动扫描）
  • 常用架构图：业务架构、产品架构、系统架构、数据架构、技术架构、应用架构、功能架构及信息架构
  • 使用Redis实现分布式锁，基于原本单体系统进行业务改造
  • 机器学习入门-读书摘要
  • Webpack和Vite插件的开发与使用
  • 二、OpenSM排障----实战生产
  • ADC入门准备（十）：信号与系统知识回顾
  • Linux Mem -- Where the mte store and check in the real hardware platform
  • 如何下载AndroidStudio的依赖的 jar，arr文件到本地
  • JVM类加载和垃圾回收（详细）
  • 【RAG落地利器】Weaviate、Milvus、Qdrant 和 Chroma 向量数据库对比
  • 群体智能优化：粒子群算法（PSO）详解与实战
  • 如何在微信小程序中添加动画效果
  • Python爬虫实战：利用代理IP获取招聘网站信息
  • Vue 2 路由指南：从基础到高级
  • 机器学习 - 线性模型
  • 在springboot加vue项目中加入图形验证码
  • 【linux】文件与目录命令 - ln
  • 渗透测试工具：SQLmap安装教程及使用