Servidor Side ListBox Visibilidade com C # e ASP.NET

Question

Estou interessado em usar um "onmouseover" evento para fazer uma caixa de listagem aparecem e desaparecem. Eu sou bastante novo com ASP.NET e eu não quero escrever javascript ainda. Eu estou tentando usar o código a seguir, ea porção mudança de cor do que funciona, mas a visibilidade caixa de listagem não funciona:

if (! IsPostBack) { Button2.Attributes.Add ( "onmouseover", "this.style.backgroundColor = 'Red', ListBox3.style.visibility = 'visível'"); }

        if (!IsPostBack)
        {
            Button2.Attributes.Add("onmouseout", "this.style.backgroundColor='Blue', ListBox3.style.visibility='hidden'");
        }

Eu tentei este código com e sem "PostBack", e ainda não sorte. Alguém ver onde meu código está me falhando?

Obrigado,

DFM

Answer 1

Tente:

    if (!IsPostBack)
    {
        btnHide.Attributes.Add("onmouseout", "this.style.backgroundColor='Blue';ListBox3.style.display='none'");
        btnShow.Attributes.Add("onmouseover", "this.style.backgroundColor='Red';ListBox3.style.display='block'");
    }

A propriedade de visibilidade funciona um pouco diferente do que a propriedade display. Quando a propriedade visibilidade está definida para 'escondido' o elemento está escondido, mas o layout não é afetado ao passo que quando definindo a propriedade de exibição para 'none' remove o elemento completamente o que pode afetar layout.

Se você deseja modificar a visibilidade da lista sem afetando o layout que você pode usar um div como um invólucro e modifique a sua propriedade de visibilidade.

<div id="wrapper">          
    <asp:ListBox ID="ListBox3" runat="server"></asp:ListBox>            
</div>
<asp:Button ID="btnShow" runat="server" Text="Button" />
<asp:Button ID="btnHide" runat="server" Text="Button" />

Modificar o ASPX para alternar a propriedade de visibilidade do elemento div que contém a caixa de listagem.

if (!IsPostBack)
{
    btnHide.Attributes.Add("onmouseout", "this.style.backgroundColor='Blue';wrapper.style.visibility='hidden'");
    btnShow.Attributes.Add("onmouseover", "this.style.backgroundColor='Red';   wrapper.style.visibility='visible'");
}