Autor Zpráva
KOM
Profil *
Ahoj, mam takoveto menu a chtel bych, aby po kliknuti na odkaz v nem, zustal prislusny odkaz zvyrazneny spolu s obrazkem a textem pod nim. Tedy takovy, jako kdyz po nem prejedete mysi nebo na nej kliknete. Abych proste vedel, kterou stranku webu si zrovna prohlizim. Snad jsem to dobre vysvetlil. Tady je kod a css.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN">
<html>
<head>
<link type="text/css" href="pokus.css" rel="stylesheet">
</head>

<body>
<div id="menu-null">
<div id="menu">
<a href="1.html">1<img src="grafika/01.jpg" alt="1" /><span>bla
bla...</span></a>
<a href="2.html">2<img src="grafika/02.jpg" alt="2" /><span>bla
bla...</span></a>
<a href="3.html">3<img src="grafika/03.jpg" alt="3" /><span>bla
bla...</span></a>
<a href="4.html">4<img src="grafika/04.jpg" alt="4" /><span>bla
bla...</span></a>
</div>
</div>
</body>
</html>

a css:

#menu-null {
width: 166px;
height: 550px;
float: left;
padding: 0;
border: 0
}

#menu {
background: #14285F;
padding-top: 20px;
position: relative;
}

#menu a {
font: 11px georgia;
color: #99CCFF;
font-weight: bold;
text-decoration: none;
letter-spacing: .1em;
line-height: 16px;
display: block;
padding: 10px;
padding-left: 30px;
border: 1px solid #14285F;
border-right-width: 0px;
border-left-width: 0px
}

#menu a:hover {
color: #ffffff;
border: 1px dotted red;
border-right-width: 0px;
border-left-width: 0px;
}

#menu a span {
display: none
}

#menu a:hover span {
display: block;
position: absolute;
top: 400px;
left: 0;
width: 131px;
z-index: 100;
color: #99CCFF;
font: 78% sans-serif;
text-align: center;
margin: 10px;
padding: 5px
}

#menu a img {
visibility: hidden;
position: absolute;
border: none;
top: 350px;
left: 55px;
height: 46px;
width: 46px;
}

#menu a:hover img {
position: absolute;
visibility: visible;
top: 350px;
left: 55px;
height: 46px;
width: 46px;
}

Dekuji vsem za rady, kdysi mi tu nekdo radil, ze by to slo pres tridy, ale to je na mne asi mooc...

PS: odkaz primo na menu
Railbot
Profil
V CSS m§žeš nastylovat třídu a tu pak přiřadit prvku, který chceš obarvit/změnit. To přiřazení ovšem musíš zajistit dynamicky, nejlépe php nebo javascript.
KOM
Profil *
A jen pres HTML a CSS to nejde? V PHP neumim vubec a cely web mam v HTML, javascript tam moc nechci cpat, i kdyz kdyz by to fungovalo? Ale sam to taky nezvladnu...
habendorf
Profil
cely web mam v HTML

Pokud máš statický web, tak tam třídu dáš na každé stránce ručně. V čem je problém?
KOM
Profil *
Problem je v tom, ze nevim jak na to, jsem zacatecnik. Nevim jak to myslis pridat tridu rucne a nevim jak udelat tridu, aby to menu zustalo zvyraznene. Muzete mne trosku nasmerovat, popostrcit? Budu vam vdecny...
habendorf
Profil
http://www.jakpsatweb.cz/css/css-tridy-class.html
KOM
Profil *
Ano, tohle jsem si uz nasel davno, kdyz mi tu kdosi radil, ze se to da udelat pres tridy. Spise bych ocenil, jak na to v mem konkretnim pripade, nemusi to byt kod, spise, kde zacit, fakt tápu!
mata
Profil
menu může vypadat třeba takto
<ul>
<li class="item1"><a href="titulni.html">Titulní</a></li>
<li class="item2"><a href="kontakt.html">Kontakt</a></li>
<li class="item3"><a href="formular.html">Formulář</a></li>
</ul>

na titulní stránce pak dám <body class="titulni">
na kontaktní stránce pak dám <body class="kontakt">
na formulářové stránce pak dám <body class="form">

a ve stylu zapíšu
.titulni .item1 {color:red}
.kontakt .item2 {color:red}
.form .item3 {color:red}

lépe samozřejmě sloučit na jeden řádek
.titulni .item1, .kontakt .item2, .form .item3 {color:red}

výhodou je, že měním jen classu u body, která je vždy na začátku souboru a nemusím se přehrabovat ve zbytku zdrojáku (menu zůstává vždy stejné), nevýhodou v přístupnosti může být to, že při vypnutém css není odlišena aktuální položka
Railbot
Profil
mata
To je blbost. Samozřejmě je nejlepší přidávat třídu k příslušné položce v menu.
KOM
Profil *
to jste mi pomohli :-) Ted uz nevim vubec co mam delat....
KOM
Profil *
Je mi jasne, ze pro zkuseneho borce, kdyz ma cely kod, je to otazka 5 minut, aby udelal to co bych chtel. Fakt by mi stacilo nejak nakopnout, tedy udelej priblizne to a to a ja to uz snad pokusem - omyl, nejak dam dohromady...
mata
Profil
Raillbot: to je nejjednodušší pokud jedeš v php, ale pro staticke stranky je tohle taky dobré řešení (jinak by asi nebylo v CSS Mastery - Andy Budd, Cameron Moll a Simon Collison, str. 197 ;-).
Railbot
Profil
mata
Používám to na statických stránkách roky a nevidím v tom problém. CSS Mastery neznám.
KOM
Profil *
Používám to na statických stránkách roky a nevidím v tom problém. CSS Mastery neznám.

Skoda ze tvoje stranky nejedou, abych videl, jak to vypada v praxi. Nemuzes mne trosku nasmerovat, podobne jako to zkusil Mata, ale fakt nevim co delat, z toho co mi sem dal Mata mi vychazi, ze se bude zvyraznovat asi cela stranka. Ja potrebuju jen menu a obrazek s textem pod nim a jeste presne tak, jak vypada, kdyz pres nej prejedes mysi
swetko
Profil
<ul>
<li><a href="titulni.html">Titulní</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li class="aktivna"><a href="formular.html">Formulář</a></li>
</ul>

.aktivna
{
font-weight:bold;
color:red;
}

..napriklad

btw: ten odkaz ktori ti poslal habendorf, a ktori si si uz precital si asi neprestdoval dobre...
KOM
Profil *
ja prece nechci zvyraznovat napisy v menu (tucne nebo cervene) - chci aby po kliknuti na odkaz v menu, zustal odkaz "oznaceny" tak, jako kdyz na odkazu stojis mysi. Tedy aby byl odkaz oramovany carkovanou cervenou carou a pod menu byl videt obrazek a pod nim popis. To jsme si asi nerozumeli...
swetko
Profil
nao a to dosiahnes tak ze v navstivenej stranke ktora sa ti otvori si k tej polozke v menu priradis triedu aktivna(a bude mat take atributy ako trieda hover)

ak nepouzivas ramce...
mata
Profil
když kliknu na odkaz přejdu přece na stránku, kde bude mít položka, na kterou jsem kliknul přiřazenou třídu .aktivna, která bude mít úplně stejnou definici stylu jako "hover" stav odkazu
KOM
Profil *
jeste bych tu tedy mel napsat: stranky mam vytvorene tak, ze jsem si v Dreamweaveru vytvoril sablonu, v ktere mam hlavicku, paticku menu a obsah a tuto sablonu prirazuji k jednotlivym strankam, na ktere poukazuje menu.
Jenze potom jiz mohu upravovat pouze obsah stranky a ne uz to okolo, tedy, hlavicku, menu atd. Nevim presne, jak mam priradit tu aktivni tridu pro to kliknuti ci po kliknuti na polozku v menu....
swetko
Profil
myslim ze by si mal mat kazdu s tich stranok vo formate html... (ako ich nahravas na server)

otvor si zdrojovy kod stranky formular (napr v Notepade, isto to ide aj v Dreamw.)

najdi si ul li a dopis toto co sme ti ukazali

potom si otvor subor *.css a dopis to co sme ti ukazali (ak mas css priamo v strankach musis to zmenit v tej sablone pre hlavicku)
KOM
Profil *
swetko

A co jste mi ukazali? Myslis toto:

.aktivna
{
font-weight:bold;
color:red;
}

Uz jsem to tu psal, nechci pismo v menu ztucnovat a cervenit!!!
KOM
Profil *
uz se v tom motam, muzete mi to vysvetlit primo na mem pripadu?
swetko
Profil
to bol iba priklad, ty si tam mozes doplnit atributy ktore potrebujes

chcel si riesenie? alebo ti mame napisat celu stranku?

vies preco ti ludia co ti tu radili (ale uz to vzdali) to ovladaju a ty nie? lebo predtim ako dali 5 stupidnych otazok na fore sa to snazili vyriesit sami,... hodinu, dve, tri...

a ked potom sli na nejake forum a dostali radu, aj ked im to nefungovalo, skusali to znavu a znovu, hodinu, dve, tri... nakoniec to povolilo...
KOM
Profil *
ja to tu resim od 11:47 co jsem tu zadal dotaz :-( Muzes neco zkouset, kdyz uz neco znas a vis co delas, ale pokud nevis kde mas zacit... nevim jak tebe, ale me to po 6h prestava bavit a rikam si, ze jsem uplnej dement...
Plaváček
Profil
KOM

Musíš se smířit s tím, že pokud děláš v DreamWeaveru v takzvaném Design Mode a pomocí šablon, něčeho podobného bez ručního zásahu do vlastního zdrojového kódu stránky nedosáhneš. Vyřešíš to přepnutím do režimu Code, kde položku, kterou chceš aktivní, označíš ručně, jak bylo výše zmíněno a vyedituješ si a ručně upravíš CSS styl.

Jinak to prostě v DreamWeaveru nejde, pokud vím. A to s ním dělám skoro 10 let.
KOM
Profil *
V dreamweaveru pracuju v kodu. Ale asi ne tak dlouho jako ty, za 10 let bych se to asi taky naucil.
Neni mi napr jasny, jestli tridu "aktivni" mam priradit ke vsem odkazum v menu a ona uz nejakym zahadnym zpusobem bude vedet, co ma udelat po kliknuti na odkaz...
Plaváček
Profil
KOM

Neni mi napr jasny, jestli tridu "aktivni" mam priradit ke vsem odkazum v menu a ona uz nejakym zahadnym zpusobem bude vedet, co ma udelat po kliknuti na odkaz...

Ne, příradiš ji jenom k odkazu aktivnímu (jinak řečeno pouze na konkrétní stránce, na které zrovna ty nebo uživatel, jste). Nicméně si myslím, že pokud k tomu není důvod, pak by stránka neměla odkazovat sama na sebe. Takže by mělo stačit jenom zrušit u konkrétní položky odkaz.

Vypadá to, že jsi v začátcích, asi bys měl vyrazit na studium, jinak se v tom ztratíš.
swetko
Profil
pozri si tento priklad
KOM
Profil *
Diky vsem za snahu pomoci lame v reseni pro ne jiste trivialniho problemu, problem je vyresen. Jeste jednou diky za vsechny podnety, je treba se ucit, se ucit, se ucit..........

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: