logo elektroda
logo elektroda
X
logo elektroda
ADVERTISEMENT
ADVERTISEMENT
Please add exception to AdBlock for elektroda.pl.
If you watch the ads, you support portal and users.

Jak zrobić przyciski graficzne w HTML z efektem zmiany po najechaniu?

muzg31 13 Jun 2005 10:08 1097 5
ADVERTISEMENT
  • #1 1573629
    muzg31
    Level 11  
    Posts: 28
    Na początek wszystkich witam.
    Zapomniałem KODY HTML którym mógł bym robić przyciski graficzne na STRONIE WWW i zmieniac grafike po najechaniu kursorem. NIE chodzi mi o SKRYPT np. JAVY tylko prosty HTML :]
  • ADVERTISEMENT
  • #2 1573721
    praw
    Level 17  
    Posts: 192
    Help: 17
    Rate: 10
    Z tego co wiem (może wiem mało ;) nie da sie tego zrobić w html-u. Chyba jednak trzeba do tego użyć javascript.
  • ADVERTISEMENT
  • #3 1574718
    muzg31
    Level 11  
    Posts: 28
    Ale ja już kiedyś robiłem takie żeczy. Ale zapomniałem jak to się robi :[

    Dodano po 1 [minuty]:

    Jak nie wie nikt o tym to niech ktoś da przynajmniej da SKRYPT JAVY :[
    Bardzo bym prosił.

    Dodano po 23 [minuty]:

    Dobra mam już to co trzeba. Dzięki za chęci :] :D
  • ADVERTISEMENT
  • #4 1579429
    wodz_u
    Level 2  
    Posts: 4
    chodzi ci o zwykly styl ?? po najechaniu na linka(np-download) zmieni on kolor mam tez skrypt jesli ten kod to za malo

    <STYLE type="text/css">
    a{
    text-decoration:none;
    color:#055089;
    }
    Poydrawiam :)

    Dodano po 1 [minuty]:

    ups :P


    <STYLE type="text/css">
    a{
    text-decoration:none;
    color:#055089;
    }
    a:hover {
    color:#717171;
    text-decoration:none;


    }
  • ADVERTISEMENT
  • #5 1588111
    Piotrek.pxf
    Level 27  
    Posts: 806
    Help: 118
    Rate: 65
    Jeśli chodzi o to, że po najechaniu myszą na jakiś obrazek wyświetla się inny obrazek to kod jest prosty:
    <a onmouseover="img1.src='najechany.jpg'" onmouseout="img1.src='nie_najechany.jpg'" href="link.htm">
    <img name="img1" src="nie_najechany.jpg" border="0" ></a>


    Pamiętaj, żeby zmieniać nazwę (img1), dla każdego przycisku inna.
  • #6 1598325
    SaraniS
    Level 26  
    Posts: 745
    Help: 78
    Rate: 26
    Witam
    Obrazek tez da sie w stylach zmienic:
    
    <style type="text/css">
    a.button { /*  "przycisk" bez grafiki */
      text-decoration: none;
      display: block;
      width: wg potrzeby;
      height: jak wyzej;
    }
    
    a.button:link, a button:visited {
      color: #rrggbb;
      background: #rrggbb;
    }
    
    a.button:hover, a.button:active {
      color: #rrggbb;
      background: #rrggbb;
    }
    
    a.graph { /* "przycisk" z grafika */
      text-decoration: none;
      display: block;
      width: wg potrzeby;
      height: jak wyzej;
    }
    
    a.graph:link, a.graph:visited {
      color: #rrggbb;
      background: url(obrazek1.gif) no-repeat center top #rrggbb;
    }
    
    a.graph:hover, a.graph:active {
      color: #rrggbb;
      background: url(obrazek2.gif) no-repeat center top #rrggbb;
    }
    </style>
    

    Jesli dla kazdego przycisku chcesz inny obrazek (np tekst jest na obrazku zapisany) to musisz zamiast klas zastosowac ID-y i opisac CSS dla kazdego przycisku z osobna.
    Dzieki uzyciu display: block, uzyskujesz efekt, ze gdzie bys nie kliknal to link zadziala - jak w tradycyjnym przycisku ;)
    Wiecej zobacz np. tutaj - menu po lewej jest na obrazkach w CSSie.
    Pozdrawiam :)
ADVERTISEMENT