使用JavaScript将不透明度应用于div图像

我想为图像使用:before选择器，但发现这是不可能的，但我读到我可以使用javascript来做到这一点。使用JavaScript将不透明度应用于div图像

我不是一个赞成在JavaScript和不完全确定如何编写代码。

这是正在使用的CSS

.carousel-cell.is-selected { 
background: #ED2; 
} 

/* cell number */ 
img.carousel-cell:before{ 
    display: block; 
    text-align: center; 
    content: counter(gallery-cell); 
    line-height: 200px; 
    font-size: 80px; 
    color: white; 
}

它位于这里的旋转木马使用 - >http://codepen.io/desandro/pen/YPezvR

现在我要做到的是为carousel-cell但对于一个:before和:after在div中的图像。

我正试图用javascript来完成此操作。

/* cell number */ 
img.carousel-cell:before{ 
opacity: 0.5; 
filter: alpha(opacity=50); /* For IE8 and earlier */ 
} 

/* cell number */ 
img.carousel-cell:after{ 
opacity: 0.5; 
filter: alpha(opacity=50); /* For IE8 and earlier */ 
}

任何人都可以帮助我做到这一点吗？

来源

2016-08-16 Terrell Anderson

你想给轮转物品不居中“不透明度：0.5”吗？ –

是的，我想图像不居中有一个不透明度0.5 @ms_nitrogen –

css

.carousel-cell { 
    opacity: 0.5; 
} 
.carousel-cell.is-selected { 
    opacity: 1; 
}

的JS LIB给予重点项目一类的is-selected，并在你的CSS文件，你可以添加的代码，这两个位，你应该是一个，还好没有在JavaScript折腾。

来源

2016-08-16 21:56:29

谢谢，我应该知道，但有时我忘了事情smh –

您可以将不透明度改为使用JavaScript和ID选择或其他选择的IMG，我会告诉你申请的不透明度为IMG标记在DIV一个例子：

<script> 
    document.getElementById("myimgid").style.opacity="0.5"; 
</script> 
<div> 
    <img id="myimgid" src="img url" > 
</div>

，你可以添加选项，这js脚本（点击，焦点，模糊等）我展示了将不透明度应用于img的基本方法。

来源

2016-08-16 21:53:14 NurlanXp

.carousel-cell.is-selected { 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
    text-align: center; 
}

来源

2016-08-16 22:00:23

嘿，这本身并没有一个很好的答案;解释你的答案会让它变得更好（参见这里发布的其他答案）。 – gsnedders

使用JavaScript将不透明度应用于div图像

回答

相关问题