如何根据其他元素的CSS属性更改元素的CSS属性？例如;如果“ div1”的颜色为黑色，我想更改“ bigbutton”的默认位置。这是我尝试过的：
的HTML
<div> <div class="div1"> </div> <div class="div2"></div> <div class="div3"></div> <button type="button" class="bigbutton">bigbutton </button> </div>
的CSS
.div1{ position:fixed; left: 10px; width:100px; height: 100px; background-color: red; } .div2{ position:fixed; left: 10px; top: 110px; width:100px; height: 100px; background-color: green; } .div3{ position:fixed; left: 10px; top: 220px; width:100px; height: 100px; background-color: teal; .bigbutton{ position: fixed; left: 15px; width: 100px; height: 30px; background-color: blue; }
JQUERY
$(document).ready(function(){ $('.div1').mouseenter(function(){ $(this).css('background','black'); }); $('.div1').mouseleave(function(){ $(this).css('background',''); }); $('.div2').mouseenter(function(){ $('.div1').css('background','yellow'); }); $('.div2').mouseleave(function(){ $('.div1').css('background',''); }); $('.div3').mouseenter(function(){ $('.div1').css('background','black'); }); $('.div3').mouseleave(function(){ $('.div1').css('background',''); }); if($('.div').css('background') == 'black'){ $('.bigbutton').css('left','200px'); } else{ $('.bigbutton').css('left','100px'); } });
没有if-else，有可能做到吗？
PS：对于格式化问题，我深表歉意，因为用手机正确格式化几乎是不可能的。谢谢。
最佳答案
当您说“根据y更改x”时，基本上是在描述if条件。
在您的示例中，还可以通过在div1变为黑色的同一代码块中更改按钮的位置来获得所需的结果：https://codepen.io/pen/RvXQMP
更新资料
要获得任何会改变div1颜色的输入的期望结果，可以使用Mutation observer，它类似于DOM更改的eventListener：https://codepen.io/pen/PVMVzw
关于javascript - jQuery-根据其他元素的CSS属性控制元素的CSS属性，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/54843372/