Jquery-如何在背景上显示加载图标时使其灰显
Jquery-如何在背景上显示加载图标时使其灰显
提问于 2015-03-09 04:56:23
当用户点击submit按钮时，我试图使背景变灰，并在灰色背景上显示加载图标。
下面是我想要显示的图标，但是我不能显示动画，这个图标只是静止不动。
下面是我的html：
<div class="container"></div>
<div id="loading-img" style=" z-index: 20;display:none;"></div>
<button id="button">Submit</button>JS：
$("#button").click(function() {
$("#container").css("opacity",0.5);
$("#loading-img").css({"display": "block"});
}我不确定如何确切地使用css来使图标在灰色背景上显示动画。有什么想法吗？？编辑：
小提琴：http://jsfiddle.net/hnk6bLbt/1/
谢谢!
回答 1
Stack Overflow用户
发布于 2015-03-09 06:12:27
1) "container“是一个类，而不是一个ID。2) .container -在CSS中设置z-index和display: none，除非有很好的理由，否则不是内联。邮箱: Demo@fiddle
$("#button").click(function() {
$(".container").css("opacity", 0.2);
$("#loading-img").css({"display": "block"});
});CSS：
#loading-img {
background: url(http://web.bogdanteodoru.com/wp-content/uploads/2012/01/bouncy-css3-loading-animation.jpg) center center no-repeat; /* different for testing purposes */
display: none;
height: 100px; /* for testing purposes */
z-index: 12;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28931791
复制相关文章
相似问题