[JS] Fancybox automatisch openen - Softwareontwikkeling

donderdag 25 september 2008 12:09

Acties:

Topicstarter

Ik ben al een tijdje op zoek naar een manier om bij het laden van een pagina automatisch een FancyBox te openen. Fancybox is een re-make van Lightbox die met een zoom-effect opent.

Fancybox werkt onder jQuery, ik ben dus eigelijk opzoek naar een manier om de jQuery automatisch te openen.

Op mijn zoektocht ben ik de volgende pagina's tegen gekomen.

- De pagina van Fancybox zelf, over een automatisch-laden functie is er niks over te vinden.

- Manier om ThickBox (ook jQuery maar werkt anders) automatisch te openen. Dit gaat volgens de unload-statement in de body-tag, die werkt helaas niet met de fancybox.

- Iemand met het zelfde probleem, helaas geeft hij geen oplossing. Hier verwijzen ze ook naar de unload-statement, ik denk echt dat het in die richting moet zitten.

De makkelijkste oplossing zou zijn om een onclick element als een onload te gebruiken, helaas komt er in mijn code helemaal geen onclick voor.

Mijn pagina ziet er nu zo uit:

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="fancy/fancy.css" rel="stylesheet" type="text/css" media="screen" />
<script src="fancy/jquery-1.2.3.pack.js" type="text/javascript"></script>
<script src="fancy/jquery.fancybox-1.0.0.js" type="text/javascript"></script>
<script src="jquery.pngFix.pack.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("p#fancy a").fancybox({
        'hideOnContentClick': true,
        'overlayShow': true,
        'overlayOpacity': 0.5
    });
});
</script>
</head>
<body>
<p id="fancy"><a href="images/splash.jpg">klik!</a></p>
<div id="fancy_wrap">
  <div style="left: 612.5px; top: 658.5px; display: none;" id="fancy_loading">
    <div style="top: -120px;"></div>
  </div>
  <div style="top: 476px; left: 245px; height: 100px; width: 154px; display: none;" id="fancy_outer">
    <div id="fancy_inner">
      <div style="display: none;" id="fancy_bg">
        <div class="fancy_bg fancy_bg_n"></div>
        <div class="fancy_bg fancy_bg_ne"></div>
        <div class="fancy_bg fancy_bg_e"></div>
        <div class="fancy_bg fancy_bg_se"></div>
        <div class="fancy_bg fancy_bg_s"></div>
        <div class="fancy_bg fancy_bg_sw"></div>
        <div class="fancy_bg fancy_bg_w"></div>
        <div class="fancy_bg fancy_bg_nw"></div>
      </div>
      <div id="fancy_nav"></div>
      <div style="display: none;" id="fancy_close"></div>
      <div style="display: none;" id="fancy_content"></div>
      <div id="fancy_title">
        <table border="0" cellpadding="0" cellspacing="0">
          <tbody>
            <tr>
              <td id="fancy_title_left"></td>
              <td id="fancy_title_main"><div></div></td>
              <td id="fancy_title_right"></td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
</body>
</html>

http://84.87.239.89/zoap/voorbeeld.php

Als jullie ideeën hebben hoor ik het graag!

donderdag 25 september 2008 13:59

Acties:

TeeDee

CQB 241

iets met

JavaScript:

function doeCooleDingen()
{
 // etc. etc.
}
window.onload = doeCooleDingen;
//of
window.attachEvent("onload",doeCooleDingen());

Zoiets?
Als je naar http://www.html-site.nl/forum/9_13952_0.html gaat, en daar het e.e.a. doorleest (en misschien ook een op een linkje klikt) kan je toch ook wel zien hoe of wat?

Heart..pumps blood.Has nothing to do with emotion! Bored

donderdag 25 september 2008 14:01

Acties:

Bosmonster

*zucht*

Het lijkt me een beetje een beperking in de Fancybox-code. Fancybox biedt zo te zien geen public functies aan die gebruikt kunnen worden voor het manueel openen van items.

Kun je geen click-event triggeren op het element dat je standaard wilt openen? Dat element kan dan volgens mij zelfs wel display:hidden zijn.

JavaScript:

1	$("jouwelement").trigger("click");

Als die geactiveerd is met fancybox, dan opent ie hem gewoon

[ Voor 37% gewijzigd door Bosmonster op 25-09-2008 14:15 ]

donderdag 25 september 2008 22:38

Acties:

Verwijderd

Bosmonster schreef op donderdag 25 september 2008 @ 14:01:
Het lijkt me een beetje een beperking in de Fancybox-code. Fancybox biedt zo te zien geen public functies aan die gebruikt kunnen worden voor het manueel openen van items.

Kun je geen click-event triggeren op het element dat je standaard wilt openen? Dat element kan dan volgens mij zelfs wel display:hidden zijn.
JavaScript:
1
 $("jouwelement").trigger("click");
Als die geactiveerd is met fancybox, dan opent ie hem gewoon

dat lijkt mij ook de snelste en gemakkelijkste oplossing