logo
23.03.2019 19:21
1
Zdravím,
chtěl bych v menu zvlášť označit odkaz právě prohlížené podstránky. Nevíte někdo, jak v CSS případně Boostrapu nastavit?
a:active, a:focus mi nefunguje

a ani a:active::before

díky
23.03.2019 20:11
2
Spatne si vykladas logiku. Aktualne prohlizena stranka se odlisuje tak, ze v menu das tagu <li> nebo <a> tridu, kterou v css odlisne nadefinujes.
23.03.2019 20:57
3
Z mobilu.

Jiste, odlisit to musite nejakou tridou, potom dle toho postavit selektor.

Ciste pro zajimavost to jde i ciste v CSS bez upravy HTML, ale jenom ve Firefoxu

@document - CSS: Cascading Style Sheets | MDN
23.03.2019 21:10
4
Jestliže je cílem řešení čistě v css (bez js), použijte selector :target a v url je třeba mít hash https://www.w3schools.com/cssref/sel_target.asp
23.03.2019 21:52
5
Nebyl by s kotvami ten problem, ze pokud uzivatel naviguje pres odkaz na url s kotvou, tak prohlizec scrolluje k one kotve? To by bylo pro oznaceni prvku v navigaci nevhodne, vlastne by se odscrolloval vrsek stranky az k navigaci.
23.03.2019 21:57
6
Původně odeslal Miroslav Foltýn
Nebyl by s kotvami ten problem, ze pokud uzivatel naviguje pres odkaz na url s kotvou, tak prohlizec scrolluje k one kotve? To by bylo pro oznaceni prvku v navigaci nevhodne, vlastne by se odscrolloval vrsek stranky az k navigaci.
To se nestane, pokud ta kotva neexistuje a v tomto případě existovat nemusí.
23.03.2019 22:01
7
:target - CSS: Cascading Style Sheets | MDN

:target selektor oznaci prvek jehoz id je shodne s aktualnim # url fragmentem. Kdyz ta kotva nebude existovat, tak jak potom oznacit ten odkaz tedy?
23.03.2019 22:20
8
Myslím že je tam dost příkladů. Kotva je
Kód:
<a name="jmeno_zalozky"></a>
a ta nemusí existovat.
23.03.2019 22:36
9
"name" atribut je v tom kontextu, kterém jste jej použil zastaralý, nevím co mi má říct. Validní je pouze na vybraných tazích (tag) - https://developer.mozilla.org/en-US/...TML/Attributes

Moje pointa v komentáři byla taková, že pokud chcete použít :target pro modifikaci stylů nějakého odkazu v navigaci (která nejspíše bude na všech stránkách), tak musíte odkazy, případně něco nad nimi, označit pomocí ID, aby to :target vůbec zachytil. To by potom vždy odscrollovalo stránku k hornímu levému okraji onoho elementu.

Možná mluvíme oba o něčem jiném, nebo něčemu nerozumím?
23.03.2019 22:42
10
musil.david popsal nejbezneji pouzivanou metodu dneska. Proc mu radite kotvy? Jste vubec koderi nebo sumari?
23.03.2019 22:44
11
Já jsem také potvrdil třídy, jak jinak. Viz hned první můj komentář.

Jenom ze zajímavosti jsem dodal @document. Snažil jsem se porozumět tomu :target.
23.03.2019 22:46
12
Původně odeslal Miroslav Foltýn
Já jsem také potvrdil třídy, jak jinak. Viz hned první můj komentář.

Jenom ze zajímavosti jsem dodal @document. Snažil jsem se porozumět tomu :target.
Jj sorry, prehledl jsem ten prispevek nahore pdo davidovo
23.03.2019 23:40
13
Máte pravdu, nepočítal jsem s tím, že ten tag umístíte jinam než na začátek stránky. Pak je třeba zajistit, aby element začínal nahoře, i když se zobrazí jinde, níže. Použije se transparentní border-top a negativní margin-top. Ale jak jsem psal v prvním komentáři, má to smysl pouze pokud je požadavek na čistě css řešení. U webu to smysl nedává.
24.03.2019 16:22
14
Nehldáte něco takového ?

Edit fiddle - JSFiddle

---------- Příspěvek doplněn 24.03.2019 v 16:22 ----------

Kód:
<script type="text/javascript">
	$(function(){
		$('.nav a').filter(function(){return this.href==location.href}).parent().addClass('active').siblings().removeClass('active')
		$('.nav a').click(function(){
			$(this).parent().addClass('active').siblings().removeClass('active')	
		})
	})
	</script>