js做过渡效果是怎么样做的？
小白对js不太熟悉，那么请问，我如果js来做点击按钮，然后div经过5s移动到右边500px的地方，这种效果的制作思路是啥？
是先写好一个class，让这些效果完全都达到了，然后用js来切换className么？
但是在点击事件里面，把所有的css效果写进去？ QUQ
HUH函数浏览 649回答 1
1回答
-
汪汪一只猫
<!DOCTYPE html><html><head><meta charset="utf-8"> <title></title><style> div{ width:100px; height:100px; background:red; transition:all 5s;}div:hover{ width:300px;} #div1{ position:relative; width:100px; height:100px; } #div2{ position:absolute; width:100%; height:100%; background:#0f0; } #div2.div2{ width:200%; height:200%; }</style></head><body><input type='button' id='btn1'/><p><b>注意：</b>该实例无法在 Internet Explorer 9 及更早 IE 版本上工作。</p><div></div> <div id='div1'> <div id='div2'></div> </div><p>鼠标移动到 div 元素上，查看过渡效果。</p></body> <script> window.onload=function(){ var oBtn=document.getElementById("btn1"),oDiv=document.getElementById("div2"); oBtn.onclick=function(){ oDiv.className='div2'; } } </script></html>给你个简单的demo看完就会了，这也只是方法中的一种，方法还有很多！
随时随地看视频慕课网APP
相关分类
JavaScript