Lightbox 2.04 mod

**lovelord** · 11-27-2009, 05:13 PM

Hi all,

I've implemented a fullscreen image banner with lightbox 2.04, this include cookie create/read/delete as described before, and varied just few thing to work with i.e. & firefox togheter (internet explorer got some struck issues on 2nd load with a cookie on board).

This modified script load banner JUST FIRST TIME, NOT IN REFRESHED PAGES, it reloads when session ends.

Tested on Internet Explorer 8.7600.16385 and Firefox 3.5.5 on Windows 7

I don't get any credit for all the source, just for changes inside.

my banner image is called: email.png
my banner id is called: popup

PS: I'm italian, so some tagged code is in italian

open and edit lightbox.js

find

Code:

document.observe('dom:loaded', function () { new Lightbox(); });

replace with

Code:

// CREAZIONE - LETTURA - CANCELLAZIONE COOKIE SESSIONE BANNER POPUP

function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name) {
	createCookie(name,"",-1);
}

// FINE ELAB. COOKIE SESSIONE

// CREO IL LIGHTBOX, SE NON E' PRESENTE IL COOKIE CLICCO, ALTRIMENTI NON CLICCO

document.observe('dom:loaded', function () { if(!readCookie('firstlight')){ myLightbox = new Lightbox();
createCookie('firstlight','firstlight');
cliccoLightbox = 1;
var firstLight=document.getElementById('popup');
firstLight.onclick.apply(firstLight);
}
else
{cliccoLightBox = 0;}
; });

open now your index.html (or what's for)
into <head> tags insert

Code:

<!-- INIZIO - GESTIONE BANNER AVVISI - POPUP CON LIGHTBOX !-->

<script type="text/javascript">
var cliccoLightbox ;
</script>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

<script type="text/javascript">
function LoadImage()
{if (cliccoLightbox == 1)
{document.getElementById('popup').click();}
}

if (document.createEvent )
{
HTMLElement.prototype.click = function()
{
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}
}

</script>

<!-- FINE - GESTIONE BANNER AVVISI - POPUP CON LIGHTBOX !-->

into your <body> tag insert

Code:

onLoad="LoadImage();"

between your <body> </body> tags insert

Code:

<!-- GESTIONE POPUP !-->

<a id="popup" href="images/email.png" rel="lightbox" title="<a href='http://www.google.it/'>GO ON GOOGLE!</a>"></a>

<!-- FINE GESTIONE POPUP !-->

That's all,
hope it could help someone,

Thanks all !

Lovelord

Thread: Lightbox 2.04 mod

Thread Tools

Search Thread

Lightbox 2.04 mod

Bookmarks

Bookmarks

Posting Permissions