-1

我正在尝试关闭一个 div 将他的不透明度设置为 0。但它不起作用

这是我的代码：

HTML：

<div id='divinfo'  style='position:absolute; bottom:2px; right:8px; width:40px; height: 41px; '><img id='divinfo' ontouchstart='openhelp();return false;' src='img/button_settings_inactive.png'></img></div>


         <div id='janelaConfig' style="display:block; opacity:0.0; height:5px; position:absolute; width:50px; left:100px; top: 175px; background-color:white; padding:20px;">

             <div id="wrapper2">
                 <div id="scroller2">
                     <p>Escolha sua regiao </p>
                     <form id="form1" name="form1" method="post" action="">
                         <label for="txtRegiao"></label>
                         <select name="estado" id="estado" onchange="setCidade(this.SelectedIndex)">
                             <option name="BR" value="BR">Barueri</option>
                             <option name="BH" value="BH">Belo Horizonte</option>
                             <option name="BS" value="BS">Brasilia</option>
                             <option name="CP" value="CP">Campinas</option>
                             <option name="CU" value="CU">Cuiaba</option>
                             <option name="CT" value="CT">Curitiba</option>
                             <option name="DI" value="DI">Diadema</option>
                             <option  value="DQ">Duque de Caxias</option>
                             <option value="FL">Florianopolis</option>
                             <option value="FO">Fortaleza</option>
                             <option value="GO">Goiania</option>
                             <option value="GU">Guarulhos</option>
                             <option value="PA">Porto Alegre</option>
                             <option value="OS">Osasco</option>
                             <option value="RE">Recife</option>
                             <option value="RJ">Rio de Janeiro</option>
                             <option value="SS">Salvador</option>
                             <option value="SA">Santo Andre</option>
                             <option value="SB">São Bernardo do Campo</option>
                             <option value="SC">São Caetano do Sul</option>
                             <option value="SP">São Paulo</option>
                             <option value="VI">Vitória</option>
                         </select>
                         <p>Audio</p>
                         <select name="audio" id="audio" onchange="setAudio(this.SelectedIndex)">
                             <option value="on">Ligado</option>
                             <option value="off">Desligado</option>
                             <select><br><br><br>
                                 </form>
                     <p>&nbsp;</p>
                 </div>
                 <p>&nbsp;</p>
                 </div>
             </div>
                <div id="close"><img id='fechar' ontouchstart='closehelp();return false;' style='display:none; position:absolute; top:10px; right:3px;'  src='img/btn-fechar.png' /></div>

jQuery：

function closehelp() {

    $("#janelaConfig").animate({
        width: "50px",
        height: "5px",
        top: "175px",
        left: "100px",
        opacity: 0.0

    }, 250);
    $("#lblStatus").text("");
    $("#fechar").hide();

    $("#divinfo").show();
};

function openhelp() {

    $("#janelaConfig").animate({
        width: "82%",
        height: "70%",
        top: "20px",
        left: "8px",
        opacity: 0.9

    }, 250, function () {
        $("#fechar").show();

    });

};
4

4 回答 4

1

不幸的是，处理不透明度的最佳方法是通过几个 CSS 标签：

.myElement {
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity:0.5;
    opacity:0.5;
}

但是，一旦你的不透明度达到 0，你最好只用隐藏元素

display:none;
于 2013-03-21T17:09:11.590 回答
0

opacity只会改变opacity元素的，width不受影响。实际上，元素仍然存在，只是不可见。heightdisplay

于 2013-03-21T17:12:10.100 回答
0

从您对另一个答案的评论中：

function closehelp() {
    $("#janelaConfig").animate({ width: "50px", height: "5px", top : "175px", left : "100px", opacity: 0.0,display:"none" },250);
    $("#lblStatus").text("");
    $("#fechar").hide();
    $("#divinfo").show();
};

将您的功能更改为：

function closeHelp() {
    $('#janelaConfig').animate({
        height: 5,
        top: 175,
        left: 100,
        opacity: 0
    }, 250, function() {
        $(this).hide();
    });
    $("#lblStatus").text("");
    $("#fechar").hide();
    $("#divinfo").show();
})

这将在动画完成后将display您的元素设置为。none

于 2013-03-21T19:09:00.500 回答
0

我创建了另一个 div 并将 janelaConfig 放在里面..效果很好

于 2013-03-25T13:51:25.180 回答