| Autor | Zpráva | ||
|---|---|---|---|
| Neznal Profil * |
#1 · Zasláno: 11. 7. 2009, 11:38:39
Ahoj chtěl bych se zeptat ... Měla by to být triviálni věc udělal jsem si jednoduchou buňku:
<td style="border-collapse: collapse; border: 1px solid black;" background="1.jpg" align="center" height="20"> Domů </td> Atuhle buňku bych chtěl udělat jako odkaz vím, že na odkazy se používá tak zvaný hover... ten mění při najetí barvy , jenže já bych tuto buňku (tabulku) chtěl udělat jako tlačítko a potřeboval bych zakomponovat do toho změnu pozadí při najetí a změnu bravy textu + ještě bych potřeboval aby zmizel rámeček nevěděl by někdo jak na to ? stačil by jednoduchý příklad .. Děkuji moc za pomoc |
||
| Ofi Profil |
#2 · Zasláno: 11. 7. 2009, 13:31:56 · Upravil/a: Ofi
Tady to máš v kompletním příkladu - teď sem to dopsal - snadněji to pochopíš:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>...</title>
<style type="text/css">
td {
border: 1px solid blue;
color:black;
background-color: white;
}
#tlacitko {
cursor:pointer;
}
</style>
<script type="text/javascript">
function changeButton(id, overOut) {
if(overOut == "over") {
id.style.border = "0px solid blue";
id.style.color = "white";
id.style.backgroundColor="black";
} else {
id.style.border = "1px solid blue";
id.style.color = "black";
id.style.backgroundColor="white";
}
}
</script>
</head>
<body>
<center>
<table border="0" cellspacing="0" cellpadding="3">
<tr>
<td>nadpis1</td>
<td>nadpis2</td>
</tr>
<tr>
<td>obsah1</td>
<td id="tlacitko" onmouseover="changeButton(this, 'over')" onmouseout="changeButton(this, 'out')">obsah2</td>
</tr>
</table>
</center></body>
</html>
hodil sem to i na net: tak mrkni jak to vypadá :) http://eforce.over.cz/veci/test.html |
||
| Neznal Profil * |
#3 · Zasláno: 11. 7. 2009, 14:28:31
Díky moc , hodně mi to pomohlo.
|
||
| Bubák Profil |
#4 · Zasláno: 11. 7. 2009, 16:52:59 · Upravil/a: Bubák
Proč se drbeš levou nohou za pravým uchem?
Odkaz nadeklaruješ jako blokový, dáš mu rozměry a pak třeba pozadí, orámování..., nějak takto: a {display: block; height: 20px; line-height: 20px; background: lime; color: navy; border: 1px solid blue;}
a:hover {background: red; color: white; border-color: lime;} |
||
| Neznal Profil * |
#5 · Zasláno: 11. 7. 2009, 17:04:00
Díky za další příspěvek ale nevim jak to mám zakomponovat .. Nemohl bys to prosím použít na nějákejm jednoduchém příkladu s třeba odkazujícím textem prosím ?
Jinak bych se chtěl ještě zeptat jak mám npsat odkaz aby ta buňka byla celá jako odkaz jelikož se mi to vůbec nedaří aby odkazovala jako celek jde mi např. jen jako odkaz udělat text v níc a já bych potřeboval mít celou buňku jako odkaz, nevěděl by někdo prosím ? Zkoušel jsem to řešit tagem <a href> ale nejde to ... Díky za pomoc |
||
| Neznal Profil * |
#6 · Zasláno: 11. 7. 2009, 17:22:51
„Bubák“
„a {display: block; height: 20px; line-height: 20px; background: lime; color: navy; border: 1px solid blue;} a:hover {background: red; color: white; border-color: lime;}“ Tohle cos poslal dám do css to jsem pochopil a co pak s tim mám udělat napsat to jako pred bunku? Takto? <div id="tlacitko"> <td height="20" width="30">obsah2</td> </div> Díky za pomoc |
||
| Bubák Profil |
#7 · Zasláno: 11. 7. 2009, 17:30:49
<style>
td {
border: 1px solid blue;
color:black;
background-color: white;
padding: 3px;
}
td.tlacitko {
padding: 0;
border: none;
}
.tlacitko a {
color: navy;
background: yellow;
text-decoration: none;
text-align: center;
display: block;
padding: 10px 20px;
border: 1px solid red;
}
.tlacitko a:hover {
background: navy;
color: white;
border-color: aqua;
}
</style>
<table border=0 cellspacing=0 cellpadding=0 align=center>
<tr>
<td>nadpis1</td>
<td>nadpis2</td>
</tr>
<tr>
<td>obsah1</td>
<td class=tlacitko><a href="#">obsah2</a></td>
</tr>
</table> |
||
| Neznal Profil * |
#8 · Zasláno: 11. 7. 2009, 17:39:32
Ještě jedna otázka jak do toho backgroundu dosadit obrázek ? Zkoušel jsem napsat cestu k obrázku třeba místo té žluté barvy ... Ale obrázek se mi tam nechce zobrazit a pozadí zůstává bílé , jinak vše funguje díky moc.
|
||
| Bubák Profil |
#9 · Zasláno: 11. 7. 2009, 18:36:13
Neznal
Pokud zde nemáš vypnuté barvení kódu, tak ve zde uvedeném kódu klikneš na background a zobrazí se W3C specifikace i s příkladem. Pokud raději česky, tak: www.jakpsatweb.cz/css/background.html www.jakpsatweb.cz/css/background-image.html Pokud používáš externí CSS, cesta je relativní vzhledem k CSS souboru. |
||
| Ofi Profil |
#10 · Zasláno: 11. 7. 2009, 19:33:55
Neznal
background-image: url("obrazek.jpg");„Jinak bych se chtěl ještě zeptat jak mám npsat odkaz aby ta buňka byla celá jako odkaz jelikož se mi to vůbec nedaří aby odkazovala j...“ jednoduše událostí onclick která bude volat funkci na otevření/načtení požadovaného obsahu.. Bubák „Proč se drbeš levou nohou za pravým uchem? “ chtěl konkrétní věc, tak jsem mu jí konkrétně ukázal, já bych to tak nikdy neřešil - to už je věc ale jiná :) |
||
| Bubák Profil |
#11 · Zasláno: 11. 7. 2009, 20:08:40
„jednoduše událostí onclick která bude volat funkci na otevření/načtení požadovaného obsahu..“
Není jednodušší dát odkazu požadované rozměry, než se zase pokoušet drbat levou nohou za pravým uchem? V kódu [#7] jsou to řádky 9, 17, 18. |
||
| Ofi Profil |
#12 · Zasláno: 11. 7. 2009, 23:50:56
Bubák
nemusím psát znovu co jsem psal v [#10] ;) |
||
|
Časová prodleva: 15 let
|
|||
0