Question

弹出框出现时如何更改整个背景颜色？

我有这段代码

    <img class="OtTTtFsDdAd" src="../img/L.png" title="Language" ID="SwWcSbDoTh">
    <div id="B">
<ul>
<li onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'"  id="OKASOKO">English</li>
<li onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" id="OKASOKO">Russian
</li></ul><a id="IANTCINSP">More languages are coming soon.</a>
</div>

$('#SwWcSbDoTh').on('click',function(){
$('#B').animate({opacity: 1,},1000);
$("body").css("opacity","0.25");
});

但是当身体不透明度为0.25＃B时，不透明度也为0.25

Answer 1

$('#SwWcSbDoTh').on('click',function(){
    $('#B').animate({opacity: 1,},1000, function(){
          //this will run after animation completed. 
          $("body").css("opacity","0.25");
    });
});

Answer 2

您可以在动画完整回调中设置背景，如下所示：

$('#SwWcSbDoTh').on('click',function(){
$('#B').animate({opacity: 1,complete:function(){
     $("body").css("opacity","0.25");}},1000);    
});

Answer 3

你只想要一个与html窗口其他部分不透明的弹出对话框，对吗？

查看此示例https://jqueryui.com/dialog/#modal-message

~~~添加代码示例

1）在标签中引用这3个文件

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

2）在div中准备对话框的内容

<div id="dialog-message">
  <p>
    Modal dialog here
  </p>
</div>

3）调用函数$（）。对话框以显示div

 $(function() {
    $( "#dialog-message" ).dialog({
      modal: true,
      buttons: {
        Ok: function() {
          $( this ).dialog( "close" );
        }
      }
    });

}）;

弹出框出现时，如何更改整个背景颜色？

3 个答案: