Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailem Číslování proměnných FOR cyklem plus další FOR cyklus s nimi

Zdravím,
nemohu se dobrat nápadu, jak napsat skript v Javascriptu pro zobrazování více fotogalerií na JEDNÉ stránce. Chci totiž, aby se velké obrázky otevíraly vždy BLÍZKO příslušných náhledů. Při použití jediné fotogalerie mám fungující skript, kde mám jeden DIV jako "rodič" a jeden imaginární obrázek vytvořený přes createElement a do něj otvírám velké obrázky po klikání na náhledy, kliknutím na velký obrázek se tento zavře. Možno vyzkoušet na dodaném odkazu.
Abych nemusela pro každou sadu obrázků vypisovat ne zrovna krátký skript pouze kvůli změně rodičovského DIVu, napadlo mě číslovat proměnné
var kam //rodičovský DIV
var snimek //imaginární obrázek nahrazený jiným po kliknutí na náhled
kam.appendChild(snimek) //připojení obou dohromady

Tj. potřebuji asi cyklem očíslovat výše uvedené proměnné tak, abych dostala var kam1, var kam2 a var kam3 plus var snimek1, var snimek2 a var snimek3, číslice 1-3 obecně nahrazuji indexem pole [s]
A s nimi chci pracovat v dalším FOR cyklu, kde se zvětšeniny budou zobrazovat podle počtu náhledů v každé sadě obrázků (ta "sada" čítá 5, nebo taky jen jediný obrázek), obecně podle indexu [n].
Ale problém je, že toto číslování mi nechodí, ve skriptu na požadované verzi tj. s více galeriemi na totožné stránce, je chyba a já ji neumím ostranit :.( . Zvětšeniny se mi ne a ne zobrazovat napravo od náhledů nebo přes náhledy, jako na prvním mém odkazu. Lámu si s tím hlavu už přes týden. Níže je můj zatím problematický kód:

  <h3>Pokus o dvourozměrné pole</h3>
<div id="blok1">
<a href="A1.jpg"><img src="A1_th.jpg" width="60px"></a>
<a href="A2.jpg"><img src="A2_th.jpg" width="60px"></a>
</div>
<div id="flek1"></div>
<p>Tady bude velký kus textu...</p>

<div id="blok2">
<a href="B1.jpg"><img src="B1_th.jpg" width="60px"></a>
<a href="B2.jpg"><img src="B2_th.jpg" width="60px"></a>
<a href="B3.jpg"><img src="B3_th.jpg" width="60px"></a>
<a href="B4.jpg"><img src="B4_th.jpg" width="60px"></a>
</div>
<div id="flek2"></div>
<p>Tady bude velký kus textu...</p>

<div id="blok3">
<a href="C1.jpg"><img src="C1_th.jpg" width="60px"></a>
</div>
<div id="flek3"></div>
<script language="JavaScript" type="text/javascript"><!--
var kam = [];
var snimek = [];
var nahled = [];
for (var s = 1; s < 4; s++)
{
kam[s] = document.getElementById("flek"+ s);
snimek[s] = document.createElement("img");
kam[s].appendChild(snimek[s]);
nahled[s] = document.getElementById("blok"+ s).getElementsByTagName("a");
for (var n = 0; n < nahled[s].length; n++)
{
  //IE a Opera vkladaji ctverecek pro imaginarni obrazek
snimek[s].style.display = "none";
nahled[s][n].onclick = function ()
{
snimek[s].src = this.href;
snimek[s].style.position = "absolute";   
snimek[s].style.display = "block";  
snimek[s].style.marginLeft = "200px";
snimek[s].style.marginTop = "-75px";
snimek[s].style.padding = "6px";
snimek[s].style.backgroundColor = "#ffffaa";
snimek[s].style.border = "2px solid green";
return false;
}
}
}
snimek[s].onclick = function()   //zavreni velkeho obrazku
{
snimek[s].style.display = "none";   
}
//-->
</script>

Prosím pěkně, poradíte mi někdo? Moc moc děkuji předem!

Předmět Autor Datum
"Lámu si s tím hlavu už přes týden" :-/ Načo vymýšľať už vymyslené... Sústreď sa na iné veci ! Tu…
pme 24.09.2010 11:12
pme
Díky, ale já NECHCI HOTOVÉ, já si skript chci udělat SAMA (abych se to naučila 8-) ). Navíc Tvůj odk…
Joan 24.09.2010 11:14
Joan
( abych se to naučila 8-) ). - Chválim !!! Na tom odkaze - pozri celú stránku až dole ... Je ich…
pme 24.09.2010 11:26
pme
Já se obávám, že si nerozumíme :-). Já přesně vím, co chci a jak to má vypadat, ale já de facto mám…
Joan 24.09.2010 11:51
Joan
Chybičkou je určitě nahled[s][n].onclick = ... neboť nahled[s][n] není nikde definován . Na rozdí…
hynajs 24.09.2010 14:18
hynajs
Ten kód má vyjadřovat, že jsem klikla na n-tý obrázek směřovaný do s-tého DIVu. Ale už jsem zjistila…
Joan 24.09.2010 14:29
Joan
Především bych řekl, že snimek[s]= ... je zbytečně. Mělo by stačit snimek= ... a popřiřazovat…
hynajs 24.09.2010 15:00
hynajs
Bingo!! Že mě to nenapadlo samotnou, už to mám (i v hlavě) poněkud překombinované. Zasloužíš si virt…
Joan 24.09.2010 15:39
Joan
Pak si musíš nastavit vždy top toho zvětšeného obrázku dle aktuálního odrolování stránky. Zkus si to… poslední
hynajs 24.09.2010 15:54
hynajs
Pole proměnných určitě udělat jde. Pak bys musela přiřazovat každé proměnné hodnotu pomocí příkazu e…
hynajs 24.09.2010 15:39
hynajs

Já se obávám, že si nerozumíme :-). Já přesně vím, co chci a jak to má vypadat, ale já de facto mám problém s identifikátory, tj. neumím domluvit skriptu, co na kterém konkrétním místě chci zobrazit. Jinými slovy: v případě jednoho prvku to umím, v případě vícero už ne.
Potřebuji přijít na to, jak proměnné cyklem očíslovat tak, aby JS pochopil, o který prvek se v kterou chvíli jedná - a to je zatím můj kámen úrazu...

Chybičkou je určitě

nahled[s][n].onclick = ...

neboť nahled[s][n] není nikde definován . Na rozdíl od nahled[s],kam[s] , které sis řádně zavedla pomocí document.getElementById nebo document.createElement.
Nemůžeš mu tedy přiřadit onclick .

Ten kód má vyjadřovat, že jsem klikla na n-tý obrázek směřovaný do s-tého DIVu. Ale už jsem zjistila, že můj způsob číslování proměnných hází "undefined" a nepomůže ani, když do výchozího prázdného vepíšu počet položek. Tady především váznu :-[

EDIT: Lze udělat pole PROMĚNNÝCH? Nikoli pole hodnot...

Bingo!! Že mě to nenapadlo samotnou, už to mám (i v hlavě) poněkud překombinované. Zasloužíš si virtuální pusu nebo aspoň :beer: protože už se to velice přiblížilo mému přání!
Jediná vada na kráse už zůstává, že se všechny zvětšeniny otevírají do totožného místa (asi že je poslední v kódu). Když totiž kliknu na obrázek na vrcholu stránky a on se zobrazí u patičky, bude to vypadat, že zobrazování nefunguje - nikoho nenapadne kvůli obrázku odrolovat na konec stránky, že.

Pak si musíš nastavit vždy top toho zvětšeného obrázku dle aktuálního odrolování stránky.
Zkus si to vygooglit, liší se dle prohlížeče. Nezdaří-li se, nezoufej, doma mám funkční kódy, hrál jsem se s tím hodně. Ke svým domácím matlaninám se dostanu až pozdě večer - ale za pusu (byť jen virtuální) se podívám, jak se daří :-).

Zpět do poradny Odpovědět na původní otázku Nahoru