none
css em grid RRS feed

  • Pergunta

  • pessoal, bom dia!

    tenho um grid que a cor de fundo do grid alterna.. e quando passo como mouse sobre a linha fica de uma cor e quando saio fica de outra.. queria que quando passasse o mouse sobre essa linha, a cor mudasse, quando saísse voltasse pra cor que era antes, e se a linha fosse selecionada, essa linha ficasse com uma outra cor em destaque.. e permanecesse até que outra linha fosse selecionada..

    quem pode me ajudar?

    sexta-feira, 10 de maio de 2013 11:50

Respostas

Todas as Respostas

  • Olá

    Utilize o pseudo element "hover" para efeito quando o mouse passar em cima, e uma classe chamada selecionado para marcar a linha selecionada. Exemplo:

    suaClasse 
    {
        background-color: #fff;
    }
    
    suaClasse:hover 
    {
        background-color: #000;
    }
    
    suaClasse.selecionado
    {
        background-color: #f00;
    }

    No seu grid, "suaClasse" para os <tr>:

    <table>
       <tr class="suaClasse">
          <td></td>
       </tr>
    </table>

    Ao selecionar uma linha, adicione outra classe css nela:

    <table>
      <tr class="suaClasse selecionado">
        <td> </td>
      </tr>
    </table>

    Este é um exemplo de como funciona. É só implementar esta ideia no seu grid.


    Ao infinito e além!

    sexta-feira, 10 de maio de 2013 12:00
  • Kyrla,

    Segue um exemplo de como fazer: http://www.codeproject.com/Articles/25984/Hover-Effects-for-GridView-Rows-Using-CSS


    Att,
    Leandro

    Se foi útil, marque como útil ou como resposta.

    • Sugerido como Resposta welington jrModerator sábado, 11 de maio de 2013 01:24
    • Marcado como Resposta kngipa segunda-feira, 13 de maio de 2013 18:56
    sábado, 11 de maio de 2013 01:05
  • Leandro, isso resolveu meu problema inicial.. obrigada!

    Agora, o que eu preciso fazer pra quando clicar sobre uma linha, ela ficar destacada, e quando clicar sobre outra, seu destaque sair, ela fica como o original e o destaque ir para uma próxima clicada?

    segunda-feira, 13 de maio de 2013 17:25
  • pessoal, o SelectedRowStyle deixa minha linha selecionada de outra cor quando clico sobre ela.. beleza.. mas como eu recupero para essa linha, o css anterior quando clico em outra linha?
    segunda-feira, 13 de maio de 2013 18:24
  • baseado no link sugerido pelo Leandro, consegui fazer o restante do que eu queria..

    para que a linha selecionada com o click mude de cor, usei a propriedade SelectedRowStyle e no evendo Bound, repeti o código do link que ele sugeriu..

    não sei se é a forma mais inteligente, mas funcionou..

    obrigada pela ajuda!

    []'s!!

    segunda-feira, 13 de maio de 2013 18:58