个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我想让图像变暗，但最终它不是全黑的，因为我可以在某种程度上看到图像。我只想使用 vanilla JS(没有 jQuery)。我使用了颜色数组 (colorArr)，但我认为还有更优雅的变暗方法。
var element = document.getElementById("img");
var colorArr = ["#fff","#ddd","#bbb","#999","#777","#555","#333","#000",];
var counter = 0;
var j=0;
var i = setInterval(function(){
if(j < colorArr.length){
element.style.backgroundColor = colorArr[j];
j++;
}
counter++;
if(counter === 8) {
clearInterval(i);
}
}, 250);div.darken img {
background-color: white;
}<html>
<body>
<div class="darken">
<img id="img"
src="http://davidrhysthomas.co.uk/linked/astrid_avatar2.png" />
</div>
</body>
</html>最佳答案
我将使用 CSS 和 JavaScript 来完成此操作。
window.onload = function () {
document.getElementById("mask").classList.add("on");
};.dark-img {display: inline-block; position: relative;}
.dark-img .mask {position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 1; opacity: 0; background-color: #000; transition: opacity 2.5s linear;}
.dark-img .mask.on {opacity: 1;}<div class="dark-img">
<div class="mask" id="mask"></div>
<img src="http://davidrhysthomas.co.uk/linked/astrid_avatar2.png" alt="" />
</div>这种技术允许我使用任何颜色和持续时间。假设橙色持续 1.5 秒:
window.onload = function () {
document.getElementById("mask").classList.add("on");
};.dark-img {display: inline-block; position: relative;}
.dark-img .mask {position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 1; opacity: 0; background-color: #f90; transition: opacity 1.5s linear;}
.dark-img .mask.on {opacity: 1;}<div class="dark-img">
<div class="mask" id="mask"></div>
<img src="http://davidrhysthomas.co.uk/linked/astrid_avatar2.png" alt="" />
</div>关于javascript - 如何使图像完全变暗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43546470/
25
4
0
使用 Vanilla JS，我希望执行如下图所示的操作，其中除了特定部分(最好是椭圆形)之外，大部分 Canvas 都变暗。 我可以通过在前面绘制半透明颜色来轻松使 Canvas 变暗，但我不确定如何
我想将 UIView “变暗”一定程度。现在，我正在像这样进行变暗: UIView *overlay = [[UIView alloc] initWithFrame:mainView.bounds];
我有一个 TCard(TGraphicControl 组件)并且它有一个属性背景(TP图片) 我希望能够使背景变暗或变暗。因此，如果我可以在游戏中玩卡片，那么它是正常的。如果我不能在游戏中玩这张卡，那
如果您熟悉 iTerm2 应用程序，您就会知道您可以像 vim 一样 Split View，并且不活动的 View 会“变暗”。 我通常在 vim 中使用三个垂直 Split View，例如，通过将背
我正在尝试创建一些 jQuery 函数，将对象 bgcolor 更改为更亮或更暗(您将参数设置为色调差异)。我认为它应该可以工作，但是它破裂了。 $.fn.changeBg = function(di
我有两个 fragment ，其中一个具有完整 View 的大小。另一个 fragment 较小并放置在其上方。如何使第一个 fragment 变暗？ 最佳答案 在 fragment XML 文件中，
我在一个 Pane 中使用 irssi 和 nicklist.pl在另一个中，每当我在 irssi Pane 中时，昵称列表 Pane 就会变暗: 如何阻止非事件 Pane 变暗？ 最佳答案 找到了!
我试图做的是使 UIImageView 更暗，以便图像结果顶部的按钮和 View 。我想给它一个在 ios6 中用户使用 Facebook 分享时给出的效果。它后面的所有内容都变得更暗，但它是可见的。
在单击登录按钮后出现的进度条微调器中，我希望当微调器在屏幕上可见时微调器后面的元素变暗或变暗。我的布局文件目前看起来像这样:
在我的应用程序中，我有一个带有进度条的刷新功能。进度条位于应该刷新的 TextView 上。问题是:如果 textview 中有很多文本，你就看不到进度条了。是否可以在 onPreExcute/onP
操作表自然会使背景 View 稍微变灰，但并不明显。我想让它变得更暗。 还有，我要怎么做才能让您无法点击其他地方？现在，如果您在操作表外部单击，操作表就会消失。我希望这种情况不会发生 - 您必须按下“
我想创建一个主页，其背景图像填充整个页面高度。在此之上，我需要添加白色文本和其他元素。 This website是我想要实现的一个例子。 我想要的: 外观: 使用下面的 CSS，文本看起来非常模糊。
我一直在开发一款增强现实游戏，并且正在实现我的暂停菜单。我的暂停菜单完全可用，UIView 显示为 ARSKView 之上的另一层。但是，我想在显示暂停菜单时使 ARSKView 变暗，然后在关闭暂停
我在 View 的右上角有一个菜单按钮 (+)，当按下按钮时，其他几个按钮会下拉供用户选择。 我想有效地调暗所有这些按钮下方的所有 View 。 我目前的做法是在所有内容之上设置一个透明 View ，
我是网络开发的半菜鸟，但我不是在使用错误的术语进行搜索，就是我不是一个非常熟练的 googler。 我正在制作一个单页网站，并且想要这样的效果，即当向下滚动新部分进入 View 时，新部分会变暗。我可
我的应用程序的背景是一个不透明的 UIImageView。在某些情况下，我想以动画方式将它从全亮度调暗到大约 50%。目前我降低了 View 的 alpha 属性并且效果很好。因为 View 后面没有
我需要向用户显示 alert 并且我希望它很漂亮。所以我使用 Bootstrap 的警报类，并像这样向用户显示 div: Some text 这段代码只显示了一个div。我想要的是将所有东
我需要在触摸 UIImageView 时使它变暗， 几乎就像跳板(主屏幕)上的图标一样。 我应该添加具有 0.5 alpha 和黑色背景的 UIView 吗？这看起来很笨拙。我应该使用图层还是其他东西
我正在将图像加载到 BitmapImage 中并将其转换为 PixelColor 的数组。我想要的是能够操纵这些像素中的一些，使它们更亮/更暗/透明，但我似乎无法让它工作。将其设置为某种颜色确实有效，
我找到了 change the opacity of a View 的方法，但我实际上需要使 View 变暗。我最好的办法是在上面放一个透明的黑色矩形，然后慢慢增加矩形的不透明度。 你知道更好的方法吗
我是一名优秀的程序员,十分优秀！