Javascript、动态 css 和转换

标签 javascript css dynamic transform

我对 javascript 有疑问。我需要使用 .classeName = "..."动态更改 div 的类,但它不会自行更新。例如,我已经在我的类(class)中进行了转换。它会缩放并设置变换原点,但我的屏幕上什么也没有出现。这是我的代码:

var panier = document.getElementById("panier");

if (panier.style.display == "none" || panier.style.display == "")
{
    panier.className = "";
    panier.style.display = "block";
    panier.style.webkitTransform = "scale(0, 0)";
}

if (panier.className.search("enleverPanier") >= 0)
    panier.className += panier.className.replace("enleverPanier", "afficherPanier");
else
    panier.className += " afficherPanier";

如您所见,我的类 afficherPanier 进行了缩放 (1,1)。 div 保留我设置的比例 (0,0),以防 div 不可见。

这是我的CSS

.afficherPanier {
 -webkit-transform-origin: left top;
 -moz-transform-origin: left top;
  -ms-transform-origin: left top;
   -o-transform-origin: left top;
      transform-origin: left top;

 -webkit-transform: scale(1, 1);
 -moz-transform: scale(1, 1);
 -ms-transform: scale(1, 1);
 -o-transform: scale(1, 1);
    transform: scale(1, 1);}

你知道为什么 scale(1,1) 不起作用吗? 谢谢你! :)

最佳答案

现在我很确定 className 正在更改为 enleverPanierafficherPanier。要解决此问题,请尝试更改

panier.className += panier.className.replace("enleverPanier", "afficherPanier");

panier.className = panier.className.replace("enleverPanier", "afficherPanier");

关于Javascript、动态 css 和转换,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23706893/

相关文章:

javascript - Nodejs递归调用堆栈错误,但是代码应该没问题

php - 在 PHP 中是否有动态扩展类的选项?

c# - 使用 typeof 进行强制转换

JavaScript:可以通过给定的 z 分数获得百分位吗?计算分位数?

javascript - 编码 JSONP <script src = Request

javascript - JS 引用错误会停止运行时线程执行吗?

jquery - 转换完成后监听新事件

html - 防止子 div 扩展到父之外?

html - 我无法使用 CSS 正确设置 HTML 元素的高度

mysql - MySQL 中日期的动态别名