我可以在JavaScript中使用CSS'calc'

在Javascript中设置位置时，我可以使用css'calc'函数吗？我可以在JavaScript中使用CSS'calc'

ePopup.style.top =“calc（100px - 1.5em）;”

来源

2016-11-29 NickC

+11

，如果你发布前尝试一下呢？ – raven

我当然试过这个，它似乎没有工作。它没有工作，因为我做了一些合成不正确的事情，或者因为它本质上不起作用。 – NickC

是的，calc()将在javascript中设置样式时起作用。

工作实例：

var innerDiv = document.getElementsByClassName('inner-div')[0]; 
 

 
function growInnerDiv() { 
 
innerDiv.style.width = 'calc(100% + 224px)'; 
 
} 
 

 
innerDiv.addEventListener('click', growInnerDiv, false);

.outer-div { 
 
display: inline-block; 
 
width: 200px; 
 
height: 100px; 
 
padding: 12px; 
 
border: 1px solid rgb(255,0,0); 
 
background-color: rgb(255,255,0); 
 
} 
 

 
.inner-div { 
 
width: 100px; 
 
height: 100px; 
 
color: rgb(255, 255, 255); 
 
font-weight: bold; 
 
text-align: center; 
 
line-height: 100px; 
 
font-family: arial, helvetica, sans-serif; 
 
background-color: rgb(255,0,0); 
 
cursor: pointer; 
 
transition: all 0.5s linear; 
 
}

<div class="outer-div"> 
 
<div class="inner-div">Click Me</div> 
 
<div>

来源

2016-11-29 17:50:21 Rounin

很高兴知道calc可以使用Javascript，所以我会坚持尝试在我的页面上完成这项工作，而不是放弃并尝试其他方法。非常感谢那个答案，尽管问题得到了7分下降分数。 – NickC

非常欢迎你@NickC。我认为你的问题是完全公平的 - 当一个过程无法正常工作时，隔离那个不起作用的过程的组成部分是非常重要的，而不是做出假设 - 所以我给你提出了一个问题。 – Rounin

我可以在JavaScript中使用CSS'calc'

回答

相关问题