| Autor | Zpráva | ||
|---|---|---|---|
| Joan Profil |
#1 · Zasláno: 12. 8. 2010, 13:43:35 · Upravil/a: Joan
Pěkné odpoledne,
podle tohoto vzoru se pokouším přetvořit vlastní fotogalerii. Nechci akorát, aby byl přednastaven jeden obrázek, který se pak klikáním na náhledy obměňuje. Chtěla bych, aby se velký obrázek zobrazoval přes náhledy a potom kliknutím zase zavřel (potom si budu hrát s průhledností, ale to je zatím hudba budoucnosti), protože mám fotogalerie v matici třeba 5x5 náhledů a muselo by se na menších monitorech rolovat. Ve svém kódu: <script language="JavaScript" type="text/javascript"><!--
var nahled = document.getElementById("zatoka08-galerie").getElementsByTagName("a");
for (i=0; i<nahled.length; i++)
{
nahled[i].onclick = function()
{
document.getElementById("zatoka08-galerie").src = self.document.getElementById("zatoka08-galerie").href;
return false;
}
}
//-->
</script>se domnívám, že mám chybu ve vyznačené části, ale konzola je spokojená, tak nevím, čeho se chytit. Ani původní this.href nepomohlo, tak mě napadlo, že se to musí rozepsat... Zde je ukázka naživo. Moje otázka je, jak přinutit Javascript, aby mi velké obrázky (tj. odkazy) zobrazoval v mnou zvoleném prvku. Poraďte mi pěkně prosím někdo :-) Hledala jsem nějaká poučení o this.href ale kupodivu nic moc názorného jsem nenašla... Pozn.: Zjistila jsem, že když dám script před html kód (ať už do hlavičky nebo hned na začátek HTML), tak konzola hlásí chybu (document.getElementById("zatoka08-galerie") is null). Když jsem ho dala až za, tak bylo vše v pořádku. Že by opravdu bylo lepší dávat script místo do hlavičky do patičky? |
||
| Chamurappi Profil |
#2 · Zasláno: 12. 8. 2010, 20:04:52 · Upravil/a: Chamurappi
Reaguji na Joan:
„Chtěla bych, aby se velký obrázek zobrazoval přes náhledy“ Ale v čem? Nejde jen tak přiřadit src k <div>u a očekávat, že se přes něj ukáže zbrusu nový obrázek — v tom je hlavně problém. Musíš měnit src nějakého připraveného <img> — buď vytvořeného skriptem (obrázek = document.createElement("img") a rodič.appendChild(obrázek)), nebo už zapsaného v HTML (a měnit mu obrázek.style.display).
„Ani původní this.href nepomohlo, tak mě napadlo, že se to musí rozepsat…“ Za this.href se ovšem neskrývá self.document.getElementById("zatoka08-galerie").href, je v něm href z právě prokliknutého objektu nahled[i], což je odkaz. Objekt s id="zatoka08-galerie" je <div>, ten nemá href. Takže this.href byl správně.
„Že by opravdu bylo lepší dávat script místo do hlavičky do patičky?“ Ano. Viz Rychlost načtení javascriptu odděleného od html. Skripty se vykonávají hned, jak na ně prohlížeč narazí, nehledě na to, jestli je stránka načtená. Mimochodem: „ for (i=0; i<nahled.length; i++)“ — Používej var.
|
||
| Joan Profil |
#3 · Zasláno: 13. 8. 2010, 13:52:01
Ach tak, mockrát děkuji, tak to jsem byla úplně mimo mísu neb o createElement a appendChild jsem dosud neměla potuchy, moje chyba.
Na webu about.com jsem našla příklad, jak se to používá (vytvoření nového odstavce, vložení textu do něj a připojení na konec stránky), tak jsem zkusila, co to s mou fotogalerií udělá. Hlavní je, že jsem pochopila princip, teď musím upravit zobrazování. Mám tyto nápady: 1) nechat, co mám a použít jiného rodiče než body - je možné uměle vytvořit např. <div> s určitým ID a tomuto konkrétnímu divu v CSS nastavit absolutní pozicování s vysokým (kolik?) z-indexem, aby se zobrazoval NAD všemi náhledy zhruba uprostřed? Jak tomuto DIVu vybrané ID v JS přiřadím? 2) přidat mezi náhledy ještě jeden neviditelný IMG s width a height = 0 (protože jsem zjistila, že display: none a taky visibility: hidden zcela znemožní otvírání miniatur v tomto obrázku) a ten použít jako SRC, kam se budou obrázky otvírat. Ale nemůžu objevit způsob, jak pomocí JS nastavit prvku např. position: absolute; left: 50px; top: 100px; apod. Preferovala bych ad1) nebo je ještě elegantnější řešení? A ještě - jak kliknutím zavřu naposledy otevřený obrázek, aby po skončení prohlížení na stránce nerušil? Do každého tagu <a href> anebo snad <img> mám přiřadit událost onclick s funkcí na zavření? Nebo se dá nějak označit naposledy otevřený obrázek a na něj navázat onclick? Zatím za vše děkuji, za týden po dovolené se sem zase ráda vrátím :-) |
||
|
Časová prodleva: 14 let
|
|||
0