1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

mudar cor texto div atraves de link

Discussão em 'Web Development' iniciada por alfinete, 28 de Março de 2008. (Respostas: 14; Visualizações: 4136)

  1. alfinete

    alfinete Power Member

    Código:
    
    <html>
    <body>
    <div id="div1"> texto ...</div>
    <div><a href="http://www.google.pt" target="_blank" onclick="document.getElementById('div1').style.color='#000080';">texto2</a></div>
    </body>
    </html>
    
    
    como podem ver tenho duas divs, uma com um texto e outra com um link

    eu queria ao certo co clicar no link mudar a cor do texto da primeira div

    se fosse possivel por css agradecia
     
  2. Doctor_Worm

    Doctor_Worm Power Member

    Por css não sei, mas é algo como isto?

    Código:
    <html>
    <body>
    <div id="div1"> texto ...</div>
    <div><a href="javascript:;" target="_self" onclick="document.getElementById('div1').style.color='#808080';">texto2</a></div>
    </body>
    </html>
    
     
  3. alfinete

    alfinete Power Member

    sim thanks esse funciona, mas como posso fazer no codigo para por no href por uma url a abrir e a mudar ao mesmo tempo de cor

    quanto a do link ka puz a bombar

    Código:
    
    <html>
    <body>
    <div id="div1"> texto ...</div>
    <div><a href="http://www.google.pt" target="_blank" onclick="document.getElementById('div1').style.fontWeight='bold';">texto2</a></div>
    </body>
    </html>
    
    so gostava de por a cena da cor
    a bombar com css
     
    Última edição pelo moderador: 30 de Março de 2008
  4. Doctor_Worm

    Doctor_Worm Power Member

    Por acaso não estás a querer mudar a cor dos links que já visitaste?

    Se sim, a solução em css é fácil, apesar de não me recordar muito bem agora, mas depois posso fazer uma pesquisa.

    Se queres mesmo mudar uma outra div, com css não sei.
     
  5. alfinete

    alfinete Power Member

    eu queria a parte da mudança de cor para o testo que esta na div e não no link por css, mas se não dá , pronto.. mas caso consigas alguma solução agradecia que a enviases
     
  6. hostmake

    hostmake Power Member

    não te queres explciar melhor?

    ele já te deu o que tu queres acho eu..
     
  7. alfinete

    alfinete Power Member

    deu-me feito com java script, e eu queria com css
     
  8. MPalhas

    MPalhas Power Member

    o que tu queres é exactamente o que tu postaste só que usando prorpriedades diferentes

    Código:
    
    <html>
    <body>
    <div id="div1"> texto ...</div>
    <div><a href="http://www.google.pt" target="_blank" onclick="document.getElementById('div1').style.color='red';">texto2</a></div>
    </body>
    </html>
    
    isto muda-te a cor do texto da div1 para vermelhor. ao usares a propriedade style em javascript (getElementById(...).style) estás a usar as propriedades CSS, logo podes alterar qualquer tipo de estilo. basta meteres style.[propriedade] = [valor]

    só há algumas diferenenças nos nomes das propriedades em relação ao CSS. os nomes que têm hiffens ( - ) mudam um bocado.
    ex:
    border-style em CSS fica
    borderStyle em javascript


    EDIT: só vi agora o teu ultimo post.
    o CSS é como o HTML não podes alterar as coisas á tua vontade a menos que uses javascript, ou uma linguagem server-side.
    com javascript já sabes como fazer
    com uma linguagem server-side (PHP ou ASP) terias que receber dados vindos do cliente, processá-los como entendesses e criar estilos baseados nesses dados, mas tens sempre que carregar uma nova página para eles terem efeito

    sem nenhuma destas duas, lamento mas não dá
     
    Última edição: 28 de Março de 2008
  9. hostmake

    hostmake Power Member

    Com o css não podes alterar o style do dentro de uma DIV quando carregas num link se é isso que pretendes, o que podes é ter classes de links.


    EX:

    Código:
    <style type="text/css">
    A:link {text-decoration: none}
    A:visited {text-decoration: none}
    A:active {text-decoration: none}
    A:hover {text-decoration: underline; color: red;}
    </style>
     
  10. _lamy_

    _lamy_ Power Member

    Eu também não sei se percebi bem a dúvida mas... diria que está na altura que começares a fazer CSS em php (ou semelhante)! :P

    minha_css.php

    onde terias

    #div1 {
    <?php
    if ($_SERVER['PHP_SELF'] == "link") {
    echo "color=#123456;\n"
    } else {
    echo "color=#654321;\n";
    }
    ?>
    }


    Edit: Não sei se funciona! :P Talvez precise de uns ajustes ou de a questão ser abordada de outra maneira, com uma variável global quando se carregasse no link! Lolol
    foi apenas uma sugestão que me ocorreu no momento!
     
  11. hostmake

    hostmake Power Member

    Ele quer on-the-fly acho eu, se não pode usar .css, e fazer um classe para a:hover.
     
  12. p3dro

    p3dro Power Member

    Uma maneira que funcione em todos os browsers, usando só css acho que não dá.

    Podes por ex. criar 2 anchors, um para o click "normal" e a outro que vai mudar de côr depois do link normal ser activado.

    Código:
    <html>
    <head>
      
      <style type="text/css">
        a.isLinkVisited{color: #000;text-decoration: none;cursor: text;}
        a.isLinkVisited:visited{color: #ff0000;}
      </style>
      
    </head>
    <body>
    
      <div>
        Isto é um teste aos links visitados <a class="isLinkVisited" href="http://www.abola.pt">Link visitado a vermelho</a> continuação do texto...
      </div>
      
      <div>
        <a href="http://www.abola.pt" target="_blank">texto2</a>
      </div>
      
    </body>
    </html>
    
    Porém no teste que fiz isto só funcionou no Firefox e no Opera, tanto no Safari como no IE* não alterava a côr para o visited, só depois de fazeres refresh à página.


    Outra solução (que pelos vistos não pretendes) será usar Javascript e assim acho que já funciona bem.

    Código:
    <html>
    <head>
    
      <style type="text/css">
        a.isLinkVisited,.jsLinkVisited{color: #000;text-decoration: none;cursor: text;}
        a.isLinkVisited:visited, .jsLinkVisited{color: #ff0000;}
      </style>
      
    </head>
    <body>
    
      <div>
        Isto é um teste aos links visitados <a class="isLinkVisited" href="http://www.abola.pt" id="lnkVisited">Link visitado a vermelho</a> continuação do texto...
      </div>
      
      <div>
        <a href="http://www.abola.pt" target="_blank" onclick="document.getElementById('lnkVisited').className='jsLinkVisited';" >texto2</a>
      </div>
      
    </body>
    </html>
     
  13. alfinete

    alfinete Power Member

    sim o que tenho ali feito com java script queria por num .css, e obrigado pelo help do php , mas eu não uso php
     
  14. alfinete

    alfinete Power Member

    é mais ou menos uma solução dessas mas essas não estão a funcionar bem

    agradeço na mesma
     
  15. kategirly

    kategirly Power Member

    olá
    gostava de sabes como é que posso pôr por exemplo, OLÁ a mudar de vermelho para azul, sempre a piscra. em html ou css
    brigada
     

Partilhar esta Página