Question

我有一个元素，当点击它时应该淡出，当再次点击它的空间时淡入。此外，当可见时，其不透明度应为0.9（而不是1）。

我的代码存在两个问题。单击元素并执行js后，悬停选择器似乎会中断。（一旦它消失了元素就会失去它的悬停效果。）第二个真的很奇怪，但是我的js解释了它：最初元素因为某些原因而具有不透明度==“”！我想这可能是因为悬停效应让js混淆了不透明度的实际值应该是什么。

function gitErDone(element){
  var op = element.style.opacity;
  if(op != 0){
    fade(element);
    return;
  } else if(op == "" || op == null){
    element.style.opacity = 1;
    gitErDone(element);
    return;
  } else {
    unfade(element);
    return;
  }
}

function fade(element) {
  //works fine :)
}

function unfade(element) {
  //works fine :)
}

以下是相关的CSS：

.sm-box{
    float:left;
    width: 100px;
    height: 100px;
    margin: 0px;
    background-repeat:no-repeat !important;
    background-position:center !important;
  }
  .sm-box:hover{
    opacity: 0.9;
    filter: alpha(opacity=90);
  }

这是其自然栖息地的元素：

<body>
<div class="container">
  <div class="sm-box"></div>
  <div class="sm-box"></div>
  <div class="sm-box"></div>
  <div id="elem" class="sm-box" onclick="gitErDone(this)"></div>
</div>
</body>

所以是的，我的js和css并不是很好。由于某种原因，js将空白不透明度拉入元素，然后打破悬停不透明效果。

为什么元素加载空白不透明度？为什么我的js取消了悬停效果？

0 个答案: