Autor | Zpráva | ||
---|---|---|---|
Krakatoa Profil |
#1 · Zasláno: 12. 8. 2011, 02:36:35 · Upravil/a: Krakatoa
Tu:
http://www.jakpsatweb.cz/zalozky.html Bych uvítal tento příklad: <style type="text/css"> ol.references li:target{background-color:#ffc} </style> <a href="#1">[1]</a> <a href="#2">[2]</a> <ol class="references"> <li id="1">1</li> <li id="2">2</li> </ol> Jde o zvýraznění záložky. Používá to např. wikipedia, příklad: http://cs.wikipedia.org/wiki/PHP#cite_note-5 Potřeboval jsem to na web, myslel jsem, že je to javascript, po zakázání javascriptu jsem si říkal, že to bude jen html/css a hledal jsem to na výše uvedené stránce, nic jsem tam nenašel, tak jsem to zjišťoval koumanim z te wikipedie. Někomu by se to třeba hodilo. Pokud je to někde jinde na jpw, tak by se to hodilo odkázat z té stranky zalozky.html s odkazem zvýraznění záložky. |
||
Chamurappi Profil |
#2 · Zasláno: 12. 8. 2011, 02:44:00
Bylo by pěkné, kdyby celý JPW podporoval zdejší superkotvu
#najdi . Na některé věci nejde pořádně odkázat.
|
||
Časová prodleva: 2 měsíce
|
|||
Yuhů Profil |
#3 · Zasláno: 28. 9. 2011, 03:10:12
Díky, dal jsem dolů do stránky http://www.jakpsatweb.cz/zalozky.html stručnou zmínku o :target a odkaz na rychlý příklad.
Superkotvu #najdi používat nebudu, protože vyžaduje javascript, který tam nechci (z důvodů kultu rychlosti a z důvodu pohanské bázně před neznámými javascriptovými silami). Zvýrazňování nadpisů, na které lidi přišli, asi dělat nebudu, protože to mám vložené jako <a name="jméno"></a> a nikoli jako ídéčko u <h2>. Pokud jde zvýraznit <h2> obsahující <a name..>, budu moc rád za radu. |
||
Chamurappi Profil |
#4 · Zasláno: 28. 9. 2011, 03:49:41
Reaguji na Yuhůa:
„z důvodů kultu rychlosti“ JPW nepotřebuje celý balík funkcí, stačí jen jedna a výrazně oškubaná. Bohatě by stačilo zvýrazňování odstavce obsahujícího hledané slovo. „z důvodu pohanské bázně před neznámými javascriptovými silami“ Můžeš se s nimi seznámit, nejsou zase tak tajemné (ani dlouhé): function zvyrazneni() { var kotva = location.hash.match(/^#najdi\((.*)\)$/); if(!kotva) return; var kdeMuze = { "P": true, "H2": true, "H3": true }; for(var i = 0, element; element = document.getElementsByTagName("*")[i]; i++) { if(kdeMuze[element.tagName] && element.innerHTML.indexOf(kotva[1]) > -1) { element.className += " zvyraznit"; element.scrollIntoView(); window.scrollBy(0, -30); return; } } } Na šestém nechám projet cyklem všechny elementy ve stránce. (Tenhle druh zápisu for u je v tomto případě rychlejší než klasika.)
Na osmém testuji, zda je jméno elementu mezi povolenými (nezajímá nás nic krom <p> , <h2> a <h3> ) a jestli jeho innerHTML obsahuje hledaný výraz.
Na desátém přiřadím třídu zvyraznit .
Na jedenáctém vyvolám narolování na element, scrollIntoView je nativní metoda v prohlížečích.
Na dvanáctém popojedu kousek nahoru, aby ten nalezenec nebyl namáčknutý na strop prohlížeče. Použití: zavolat zvyrazneni() kdekoliv na konci stránky (asi v patka.js , celá ta funkce by mohla být tam).
V CSS se pak zvýraznění nastyluje podle třídy zvyraznit , tedy nějak takto:
p.zvyraznit, h3.zvyraznit { background: #FFCFA4; border: 1px solid #FFA24A; } h2.zvyraznit { /* asi nic… */ } „Pokud jde zvýraznit <h2> obsahující <a name..>, budu moc rád za radu.“ Bez JS nejde. Skriptem by to bylo takhle: var acko = document.getElementsByName(location.hash.substr(1))[0]; if(acko) acko.parentNode.className += " zvyraznit"; Ani jeden z uvedených skriptů nepočítá s tím, že by se kotva dodatečně změnila během načtení stránky. Pomohlo by to tedy jen těm, kdo jsou na takovou adresu přímo odkázáni odjinud (typicky z diskuse). |
||
__construct Profil |
#5 · Zasláno: 28. 9. 2011, 08:38:30 · Upravil/a: __construct
Chamurappi:
Nebolo by dobré tam doplniť aj prototypizáciu innerText u?
↓Edit: Neviem prečo som mal pocit, že v Tebou uvedenom kóde nie je innerHTML , ale innerText . Preto som písal o tej prototypizácii.
|
||
Chamurappi Profil |
#6 · Zasláno: 28. 9. 2011, 23:23:46 · Upravil/a: Chamurappi
Reaguji na __constructa:
O použití innerText /textContent místo innerHTML jsem uvažoval, ale jednak by se tím zkomplikoval kód o něco, co už připomíná tajemné javascriptové síly, jednak lze počítat s tím, že si osoba odkazující na takovou kotvu ověří, že se trefuje, a případně změní slovo, na které cílí, takže nehrozí, že by innerHTML až tak vadilo.
Řádek osm by šel bez prototypu napsat i takhle: if(kdeMuze[element.tagName] && (element.innerText || element.textContent).indexOf(kotva[1]) > -1) |
||
Yuhů Profil |
#7 · Zasláno: 29. 9. 2011, 01:21:17
díky, mám co číst, až se budu zase hodně nudit
|
||
Časová prodleva: 13 let
|
0