ugrás a tartalomhoz

Klikkre legfelülre ugró div

Creative · 2010. Szep. 24. (P), 16.12
Üdv!

Nos ide még nem írtam :)
Lássuk a gondom: Adott egy sima .html fájl, amiben szerepel egy link. Azt szeretném elérni, hogy ha ráklikkelek, akkor megjelenjen minden tartalom felett egy div, ami az egész képernyőt áttetsző háttérel szépen leborítja, és iframe-el egy másik .html fájlt a közepébe hívtam már. Maga ennek a klikkre behívás része nem megy sajnos :S
<div class="szb_1">
<div id="images_left">
<img src="/media/images/rendezvenyek_1.jpg" class="light" width="80" height="80" />
<img src="/media/images/rendezvenyek_2.jpg" class="dark" width="80" height="80" />
<img src="/media/images/rendezvenyek_3.jpg" class="light" width="80" height="80" />
</div>
<div class="szoveg">
<a href="/">K&eacute;pgal&eacute;ria</a>
</div>
</div>
Gondolom a lényege látható, tehát a linkre szeretném megoldani valahogy, hogy egy olyan div-et rakjon maximális z-index értékkel, aminek alapból adtam egy stílust már(fullscreen), és ebbe szerepeljen az általam behívott fájl.
Előre is köszönöm a válaszokat

C.
 
1

Ha ennyire nem megy a dolog,

kuka · 2010. Szep. 24. (P), 16.17
Ha ennyire nem megy a dolog, akkor miért nem használsz egy készen kapható lightbox szkriptet?
2

Lightbox

Poetro · 2010. Szep. 24. (P), 16.20
Erre van a kismillió Lightbox(szerű) implementáció, az oldaladon használt JavaScript keretrendszer függvényében érdemes kiválasztani a neked tetszőt.

De persze kézzel is meg lehet írni, valószínű nem is lesz túl sok sor, és főleg CSS ismereteket igényel. Amire szükséged lesz:
  • Elkapod a kattintás eseményt a linken.
  • Létrehozol egy új div-et, aminek megfelelő osztályt adsz, hogy a z-index-e a legmagasabb legyen, valamint a body végére pakolod.
  • Az új div-et JavaScripttel átméretezed akkorára amekkora az oldal szélessége és magassága.
  • Beleraksz egy code]iframe[/code]-et, aminek megadod az URL-jét, valamint szélességé és magasságát.
3

Solved

Creative · 2010. Szep. 28. (K), 09.30
kuka :: Az alapelv épp az, hogy ne kész scriptet használjak :)
poetro:: Végülis kissebb struktúramódosítással, és tanácsoddal sikerült is megvalósítani :) A megoldás az lett, hogy adott az oldalam, mely 3 fájlt include -ol. A tartalomért felelős oldalba elhelyeztem egy divet, melyben legenerálom a könyvtár tartalma (értsd képek száma) alapján a galériámat, css-el ráadom a kellő kinézetet és egyedi azonosítóval ellátva a JS tudja, ha ráklikkelek, új divet dob fel, melynek css-el belőttem a teljes képernyőn középre helyezést, elsötétített hátteret, és a képek közti lapozás lehetőségét. Mondhatni... Home-Made-Lightbox :) Apropó, Poetro, lassan te leszel az én személyes weblaboristám ^^

Köszi srácok!
C.