[Javascript] Automatisch script inladen bij opening pagina

[Verwijderd]

Ik heb een lightbox die een div inlaad zodra iemand op de pagina klikt.
Maar nu wil ik dat automatisch de lightbox word geopend zodra iemand op de pagina komt.

Omdat dit niet een normale lightbox is, lukt het me niet om dit voor elkaar te krijgen.

De lightbox is afkomstig van http://particletree.com/features/lightbox-gone-wild.


In de lightbox.js zit het volgende stukje script (is een gedeelte):

code:

Event.observe(window, 'load', initialize, false);
Event.observe(window, 'load', getBrowserInfo, false);
Event.observe(window, 'unload', Event.unloadCache, false);


var lightbox = Class.create();

lightbox.prototype = {

yPos : 0,
xPos : 0,

initialize: function(ctrl) {
this.content = ctrl.href;

Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
ctrl.onclick = function(){return false;};

},

Volgens mij word de lightbox met de volgende script ingeladen.

code:

initialize: function(ctrl) {
this.content = ctrl.href;

Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
ctrl.onclick = function(){return false;};

},

De volgende code vervang ik:

code:

this.content = ctrl.href;

Door:

code:

this.content = "http://www.voorbeeldlink.nl";

Nu wordt zodra er op de link word geklikt altijd http://www.voorbeeldlink.nl geopend. Dit is een voorbeeld om te testen of het werkt.
Maar hoe kan ik ervoorzorgen dat hij dit automatisch doet, zodra de pagina word geopend.

[Verwijderd]

leg eerst eens even uit wal al je objecten en methods doen, want hier is niet wijs uit te worden zonder extra info

- Event.observe is een wrapper voor addEventListener neem ik aan?
- wat doet het activate method? En wat retourneert het?
- wat doet het bindAsEventListener method?
- wat houdt het content property in?
- wat is het ctrl argument?

[Verwijderd]

Dan ben je niet de enige die er wijs uit word, daarom zoek ik een uitweg via dit forum.

Verwijderd schreef op dinsdag 04 december 2007 @ 13:47:
leg eerst eens even uit wal al je objecten en methods doen, want hier is niet wijs uit te worden zonder extra info

- Event.observe is een wrapper voor addEventListener neem ik aan?
- wat doet het activate method? En wat retourneert het?
- wat doet het bindAsEventListener method?
- wat houdt het content property in?
- wat is het ctrl argument?

[BtM909]

Het gaat om een script van derden, dan lijkt het me verstandiger contact op te nemen van de maker. Of het is supported, dan heb je geluk. Is het un-supported, dan lijkt het me verstandiger om je in de materie te verdiepen

[KabouterSuper]

Volgens mij snap je het lightbox script niet helemaal. Wat je stukje code doet is het koppelen van een event aan je element, niet het "inladen van lightbox" (wat dat dan ook moge betekenen).

Los hiervan, wat wil je precies? Je bent nogal slordig in je tekst...wat betekent "op de pagina klikken", "op de pagina komen" en "de pagina openen"? Daardoor wordt het moeilijk te snappen wat je precies wilt.

Mijn interpretatie:
op de pagina klikken = hyperlink klikken
op de pagina komen = laden van pagina
de pagina openen = ???

Ik gok dat je bij het laden van de pagina (onLoad event) het lightbox click event wilt uitvoeren. Klopt deze veronderstelling?

[Verwijderd]

Deze stelling klopt, bij het inladen van de pagina moet een ligtbox click event uitgevoerd worden.

KabouterSuper schreef op dinsdag 04 december 2007 @ 14:17:

Ik gok dat je bij het laden van de pagina (onLoad event) het lightbox click event wilt uitvoeren. Klopt deze veronderstelling?

[KabouterSuper]

Dan moet je op zoek naar de functie die het event uitvoert. Deze functie kan je dan middels een onLoad aan je window hangen, zodat deze bij het laden uitgevoerd wordt.

[gvanh]

Je zal inderdaad eerst moeten uitvinden wat de functie is, die moet worden aangeroepen om het gewenste script uit te voeren. Als je die functie-aanroep hebt gevonden, kun je het volgende stukje JavaScript opnemen in je HTML document, hetzij als een apart bestand, hetzij direct in je HTML.

JavaScript:

function handleWindowLoad() {
  // hier de functie om de lightbox-boel te starten
}

window.onload = handleWindowLoad;

Let erop dat je de functie die je meegeeft aan "window.onload" zonder aanhalingstekens en zonder haakjes neerzet. Dan wordt de functie pas uitgevoerd als de pagina daadwerkelijk is geladen.
Je roept dan dus een soort 'tussenfunctie' aan (hier heb ik die als voorbeeld "handleWindowLoad" genoemd), waarin je vervolgens de aanroep naar het Lightbox script neerzet. Op die manier kun je ook eenvoudig argumenten meegeven in de functie-aanroep... mocht dat nodig zijn.

Verder kun je deze functie natuurlijk ook gebruiken om andere onderdelen van je website te initialiseren of te starten.

[Amorphis]

Dit is volgens mij niet zo heel moeilijk, volgende code zou het ongeveer moeten doen (niet getest).
Geef de a tag waarmee je normaal de lightbox onclick wilt starten een id en niet de class lbOn.
Voeg volgende code toe binnen script tags in je eigen pagina na de includes van de javascript files. (dus onder prototype.js en lightbox.js)

JavaScript:

Event.observe(window, 'load', function() {
var lb = new lightbox(document.getElementById('idnaarjeatag'));
lb.activate();
}, false);

[Verwijderd]

Zover ik weet (en helaas is mijn ervaring in Javascript tot op heden beperkt tot het broodnodige om AJAX procedures uit te voeren) kan je functies meeladen in een pagina om uit te voeren zodra je de <body> tag in je HTML opent. Ik heb bijvoorbeerld automatisch, dmv AJAX, verversende DIV elementen op mijn pagina die om de x ms een screenshot van mijn vorige projecten tonen. Het script moet echter gestart worden en dat doe ik in mijn geval door de functie (bijvoorbeeld) refreshProjects() te starten on mijn body:

<body onload="refreshProjects()";>

laad je de functie echter in een pagina die wordt ge-'include' (zoals gebruikelijk met PHP) dan heb je natuurlijk geen <body> element meer om deze functie in te laden. Het enige nadeel fan de onload event is dat deze alleen toepasbaar is op het <body> element.
Is dit het geval dan zal je creatief moeten zijn. Ik zou er dan, persoonlijk, voor zorgen dat ik alle stappen naging die de pagina hoe dan ook zou uitvoeren zou opsommen, om te kijken of een van deze stappen (google) aan een functie gekoppeld kan worden.

Het onfocus=""; event houdt in dat een bepaald object geselecteerd wordt (dit is dus niet alleen door erop te klikken maar ook door de tab toets en misschien dus ook bij het laden van de pagina). Het is eigenlijk net als bij een inlogscript op een willekeurige wesite, wanneer je [ENTER] drukt na het invoeren van je username/password; als je [ENTER] dukt, druk je eigenlijk op de 'submit' button van een form. Je moet je er dan bij voorstellen dat die enter-knop al voor-geselecteerd is om je [ENTER] opdracht daarop toepasbaar te maken (als je bijvoorbeeld meerder submit knoppen hebt op de website is dit van belang). Welnu, je kan zeggen dat die knop op dat moment is focus is (is niet helemaal correct maar dieper dan dit zal ik je niet lastigvallen momenteel). Als je weet welk element t gefocust is bij het openen van je gespecificeerde pagina, zal je (mits ik het zelf goed heb begrepen) een functie kunnen kopplene aan de onfocus""; event van dat element (heb je er geen dan kan een 'hidden' element ook uitkomst bieden).

Hope it helps.,