| Autor | Zpráva | ||
|---|---|---|---|
| VŠ Profil * |
#1 · Zasláno: 27. 6. 2009, 16:00:58
Zdravím, potřebuji urychleně pomoc. Patlám se s měnícíma se tlačítkama při přejezdu myší. Potřebuji jako odkaz mít div, čili je to div uvnitř tagu <a>. Jenže takový způsob není validní. Nenapadá mne, jak jinak to udělat (snad jedině přes měnící se obrázky). Pokud je to nesrozumitelné, můžu poslat kód. Děkuju.
|
||
| Miloš Profil |
#2 · Zasláno: 27. 6. 2009, 16:07:01 · Upravil/a: Miloš
Několik řešení:
1) Jestliže to funguje, vykašli se na validitu 2) Jestliže máš v <div>u jen inline obsah (text a obrázky), ale žádné další bloky (<p>m <ol> a podobně), pak obrať pořadí takto <div><a>blablabla</a></div> 3) Použij javascript – adresu pověš v divu na onclick. |
||
| Miloš Profil |
#3 · Zasláno: 27. 6. 2009, 16:09:01 · Upravil/a: Miloš
Jejda – teď koukám – tobě jde o měnící se tlačítka? To jako odkazy? A k čemu je tam pak ten div? To nemůžeš tlačítka dělat lidsky přes background-image? Nebo dokonce přes barvu/border – http://www.jakpsatweb.cz/priklady/jakotlacitko.html
|
||
| VŠ Profil * |
#4 · Zasláno: 27. 6. 2009, 16:10:04
Funguje to, ale validita je podmínkou. Obrátit se to nedá, to už to pak nefunguje. Onclick jsem zkoušel, ale nepřesměrovalo mě to na tu jinou stránku. Jen se objevila hláška, že na stránce došlo k chybě.
|
||
| Miloš Profil |
#5 · Zasláno: 27. 6. 2009, 16:15:22
Byl by příklad kódu? Jak jsi to psal?
|
||
| VŠ Profil * |
#6 · Zasláno: 27. 6. 2009, 16:16:12
Tady je můj kód:
<a href="1.html" class="a-tlacitko2"><div class="tlacitko2">Odkaz 1<span class="raquo">»</span></div></a> A to je externě nastylovaný takto: .tlacitko2 {height: 47px; width: 275px; background-image: url('images/menu2-background.jpg'); border-width: 1px; border-style: solid; border-color: #c4d4d1; text-align: left; padding-left: 25px; margin-bottom: 16px; line-height: 200%} .tlacitko2:hover {height: 47px; width: 275px; background-image: url('images/menu2-background-hover.jpg'); border-width: 1px; border-style: solid; border-color: #c4d4d1; text-align: left; padding-left: 25px; margin-bottom: 16px; line-height: 200%; color: #ffffff} .raquo {position: absolute; left: 275px; font-size: 140%} .a-tlacitko2 {color: #8895b2; font-family: arial, sans-serif; font-style: italic; font-weight: bold; font-size: 140%; text-decoration: none} Je to i na mě dost složitý a nepřehledný, ale jsem už tak zblblej, že to jednodušejc nesvedu :) |
||
| Bubák Profil |
#7 · Zasláno: 27. 6. 2009, 16:18:01
„Potřebuji jako odkaz mít div“
Pokud ti to funguje, tak nejrychlejší validní řešení je použít <span> a deklarovat ho jako blokový. „Obrátit se to nedá, to už to pak nefunguje.“ Funguje, musí, běžně se to tak dělá, něco jsi měl chybně, ale protože nikdo znalý neviděl tvůj kód, tak ti nikdo neřekne, co to bylo. Kdybys dal odkaz na stránku, nebo aspoň podstatnou část kódu svého "zázraku", dalo by se najít čistší řešení. |
||
| VŠ Profil * |
#8 · Zasláno: 27. 6. 2009, 16:20:06
Bubák: Jak se span deklaruje jako blokový?
|
||
| Miloš Profil |
#9 · Zasláno: 27. 6. 2009, 16:20:38 · Upravil/a: Miloš
span {display: block} |
||
| Bubák Profil |
#10 · Zasláno: 27. 6. 2009, 16:25:29
Kýho šlaka, proč absolutně pozicuješ? Z takových tlačítek chce mít vodorovné, nebo svislé menu?
|
||
| VŠ Profil * |
#11 · Zasláno: 27. 6. 2009, 16:25:47
No tak to pomalu vypadá, že s tím blokovým spanem je to dobrý. Funkčnost se nezměnila a validátor nekřičí.
|
||
| VŠ Profil * |
#12 · Zasláno: 27. 6. 2009, 16:27:08
Bubák: Svislé. Je to absolutní pozicování uvnitř jiného divu.
|
||
| Bubák Profil |
#13 · Zasláno: 27. 6. 2009, 17:32:51
Co třebas nějak takto, případně si douprav:
<style>
ul, li {
margin: 0;
padding: 0;
list-style: none;
}
.tlacitko2 li {
width: 275px;
height: 47px;
line-height: 47px;
font-size: 1.4em;
}
.tlacitko2 a {background: #def url('images/menu2-background.jpg');
text-decoration: none;
position: relative;
display: block;
height: 100%;
border: 1px solid #c4d4d1;
padding-left: 20px;
}
.tlacitko2 a:hover {
background: #efd url('images/menu2-background-hover.jpg');
}
.tlacitko2 span {
color: red;
position: absolute;
top: 0;
left: 250px;
}
.tlacitko2 a:hover span {color: blue} /* trochu obskurni zapis pro IE6 */
</style>
<ul class="tlacitko2">
<li><a href="1.html">Odkaz 1<span>»</span></a>
<li><a href="1.html">Odkaz jiný<span>»</span></a>
<li><a href="1.html">Další kdesi cosi<span>»</span></a>
</ul> |
||
| blizz_boz Profil |
#14 · Zasláno: 27. 6. 2009, 18:39:50
VŠ
alebo použi JQuery |
||
| Bubák Profil |
#15 · Zasláno: 27. 6. 2009, 18:50:45
blizz_boz
Kanón na vrabce? |
||
| VŠ Profil * |
#16 · Zasláno: 27. 6. 2009, 21:08:44
Bubák: díky za kód, podívám se na to zítra. Dneska už jdu spát.
Ještě dotaz: jak nainstaluju IE 6, když mám nainstalovaný IE 8? Musím nejdřív odebrat novější IE? |
||
| Miloš Profil |
#17 · Zasláno: 27. 6. 2009, 21:13:40
V žádném případě: http://tredosoft.com/Multiple_IE
|
||
| Bubák Profil |
#18 · Zasláno: 27. 6. 2009, 21:51:47
K ještě dotazu, proč?
Pokud z důvodů testování, já používám třebas http://browsershots.org ale tam nezjistíš třebas chování hover efektů a taky to chvíli trvá. Pak je možnost IE6 pouze rozbalit, přidat prázdný soubor process.exe.local a spustit, ale nefungují v tom třebas podmíněbé fomentáže a CSS filtry. Na něco jsou k nalezení návody, jak to rozchodit. Krom toho jsou programy, jako IETester, Internet Explorer Collection..., které v sobě mají několik jader IE. Poslední možnosti jsou spouštět jiné verze IE nativně, použít dualboot, nebo virtualizaci. |
||
| VŠ Profil * |
#19 · Zasláno: 28. 6. 2009, 07:27:43
Bubák: co je #def a #efd v tvém kódu? Nikdy jsem to neviděl.
|
||
| Bubák Profil |
#20 · Zasláno: 28. 6. 2009, 08:30:07
„#def a #efd v tvém“
Použil jsem to proto, že jsem neměl tvé obrázky pozadí, a nechtělo se mi je malovat. Je to zkrácený šestnáctkový zápis barvy v CSS (pozor, nefunguje v HTML), prohlížeče s tím nemají problém, více třebas: www.jakpsatweb.cz/barvy-zapis.html podkapitola Zkrácený zápis A taky rovnou v CSS specifikaci: www.w3.org/TR/CSS21/syndata.html#color-units The format of an RGB value in hexadecimal notation is a '#' immediately followed by either three or six hexadecimal characters. The three-digit RGB notation (#rgb) is converted into six-digit form (#rrggbb) by replicating digits, not by adding zeros. For example, #fb0 expands to #ffbb00. This ensures that white (#ffffff) can be specified with the short notation (#fff) and removes any dependencies on the color depth of the display. Strojový google překlad |
||
| VŠ Profil * |
#21 · Zasláno: 28. 6. 2009, 11:09:04
Bubák: jo jo, chvíli po tom, co jsem se zeptal, jsem na to taky přišel :-) Protože takový zápis vůbec nepoužívám, tak mě to nenapadlo hned. Jinak za kód ještě jednou dík, po úprávách jsem ho použil.
Bubák, Miloš: A taky dík za ty íéčka. |
||
|
Časová prodleva: 15 let
|
|||
0