| 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 foru 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 innerTextu?
↓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