使用 onmouseover 更改 position

Question

 <.DOCTYPE html> <html> <head> <title>Button Homework</title> <script> function first() { document.getElementById('type1').style;left= "100px". } function second() { document.getElementById('type1').style;position = 'absolute'; } </script> </head> <body> <h1>Special Button</h1> <input id = 'type1' type = 'button' value = 'Click' onclick = 'output();' onmouseover= 'first'() onmouseout= 'second'();' /> </body> </html>

每当您 hover 超过它时，我都试图让我的按钮移到中间，但我似乎不能这样做。 这是我的编码，有人可以帮我吗？ 谢谢！

Answer 1

您需要拥有position:absolute才能使left css 属性正常工作。 我还更正了您在input字段中的 function 调用，请检查

<script>
           
            function first()    {
                    let randomValue1 = Math.floor(Math.random()*255);
                    let randomValue2 = Math.floor(Math.random()*255);
                    let randomValue3 = Math.floor(Math.random()*255);
                let randomColor = `rgb(${randomValue1},${randomValue2},${randomValue3})`;
                document.getElementById('type1').style.position = 'absolute';
                document.getElementById('type1').style.left= "100px";                
                document.getElementById('type1').style.backgroundColor= randomColor; 


            }
            
            function second()   {
                document.getElementById('type1').style.position = 'absolute';
                document.getElementById('type1').style.left= "0px";     
                document.getElementById('type1').style.backgroundColor= 'rgb(239, 239, 239)';

            }
        </script>

<input id = 'type1' type = 'button' value = 'Click' onclick = 'output();'
                            onmouseover= 'first()' onmouseout= 'second()';' />

使用 onmouseover 更改 position

问题描述

1 个解决方案

解决方案1
1 已采纳 2021-05-29 06:57:46

使用 onmouseover 更改 position

问题描述

1 个解决方案

解决方案1 1 已采纳 2021-05-29 06:57:46

解决方案1
1 已采纳 2021-05-29 06:57:46