problem mit leightbox/lightbox

[deak]

schönen Tag zusammen,

Folgendes:
ich habe auf meiner site:



eine lightbox(von Leightbox) eingebunden, diese wird über links aufgerufen (links auf der Seite):

<a href="#lightbox1" rel="lightbox1" class="lbOn">

ein link der die lightbox aufruft wird über die Klasse definiert.
soweit alles ok. Man klickt einen link und die lightbox wird angezeigt.
Ich möchte nun aber dass der aktive link (der gedrückt wurde
um die lightbox zu aktivieren) seine farbe ändert.

Ich hab das dann so gemacht:

eine kleine Funktion, die im head steht:

<script type="text/javascript">
function leuchten(id, farbe) {
var link = document.getElementById(id);
link.style.color = farbe;
alert("yo");
}
</script>

und dann der link der die lightbox und die funktion aufruft:

<a href="#lightbox1" rel="lightbox1" id="link" class="lbOn" style="color:#000000" onclick="javascript:leuchten('link', '#FFFFFF');">780.49</a>

------------------------------------------------------------
Wenn class="lbOn" mit im link, steht dann wird aus irgendeinem Grund
die Funktion lechten() blockiert und nicht ausgeführt.

Also ohne die Klasse wird die Funktion ausgeführt,
und der link wird umgefärbt, natürlich funktioniert dann die lightbox
nicht mehr.

-------------------------------------------------------------

Hat jemand vielleicht schonm mal mit der "leightbox" gearbeitet, und eine
Lösung für das Problem?
Es würde ja theoretisch funktionieren, wenn ich die leightbox über einen
onclick - handler aktiviere, nur wie?

Leightbox:

/*-------------------------------GLOBAL VARIABLES------------------------------------*/

var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;

/*-----------------------------------------------------------------------------------------------*/

//Browser detect script origionally created by Peter Paul Koch at QuirksMode - for all your browser quirks

function getBrowserInfo() {
if (checkIt('konqueror')) {
browser = "Konqueror";
OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible')) {
browser = "Netscape Navigator"
version = detect.charAt(8);
}
else browser = "An unknown browser";

if (!version) version = detect.charAt(place + thestring.length);

if (!OS) {
if (checkIt('linux')) OS = "Linux";
else if (checkIt('x11')) OS = "Unix";
else if (checkIt('mac')) OS = "Mac"
else if (checkIt('win')) OS = "Windows"
else OS = "an unknown operating system";
}
}

function checkIt(string) {
place = detect.indexOf(string) + 1;
thestring = string;
return place;
}

/*-----------------------------------------------------------------------------------------------*/

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.rel;
Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
ctrl.onclick = function(){return false;};

},




// Turn everything on - mainly the IE fixes
activate: function(id){
if (browser == 'Internet Explorer'){
this.getScroll();
this.prepareIE('100%', 'hidden');
this.setScroll(0,0);
this.hideSelects('hidden');
}
this.displayLightbox("block");
alert( this.id);



},

// Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
prepareIE: function(height, overflow){
bod = document.getElementsByTagName('body')[0];
bod.style.height = height;
bod.style.overflow = overflow;

htm = document.getElementsByTagName('html')[0];
htm.style.height = height;
htm.style.overflow = overflow;
},

// In IE, select elements hover on top of the lightbox
hideSelects: function(visibility){
selects = document.getElementsByTagName('select');
for(i = 0; i < selects.length; i++) {
selects[i].style.visibility = visibility;
}
},

// Taken from lightbox implementation found at Lightbox JS
getScroll: function(){
if (self.pageYOffset) {
this.yPos = self.pageYOffset;
} else if (document.documentElement && document.documentElement.scrollTop){
this.yPos = document.documentElement.scrollTop;
} else if (document.body) {
this.yPos = document.body.scrollTop;
}
},

setScroll: function(x, y){
window.scrollTo(x, y);
},

displayLightbox: function(display){
$('overlay').style.display = display;
$(this.content).style.display = display;
if(display != 'none') this.actions();

},

// Search through new links within the lightbox, and attach click event
actions: function(){
lbActions = document.getElementsByClassName('lbAction');

for(i = 0; i < lbActions.length; i++) {
Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
lbActions[i].onclick = function(){return false;};

}

},

// Example of creating your own functionality once lightbox is initiated
deactivate: function(){
if (browser == "Internet Explorer"){
this.setScroll(0,this.yPos);
this.prepareIE("auto", "auto");
this.hideSelects("visible");
}

this.displayLightbox("none");

}
}

/*-----------------------------------------------------------------------------------------------*/

// Onload, make all links that need to trigger a lightbox active
function initialize(){
addLightboxMarkup();
lbox = document.getElementsByClassName('lbOn');
for(i = 0; i < lbox.length; i++) {
valid = new lightbox(lbox[i]);
}
}

// Add in markup necessary to make this work. Basically two divs:
// Overlay holds the shadow
// Lightbox is the centered square that the content is put into.
function addLightboxMarkup() {

bod = document.getElementsByTagName('body')[0];

overlay = document.createElement('div');
overlay.id = 'overlay';

bod.appendChild(overlay);
}

Meine Funktion:

function leuchten(id, farbe) {
var link = document.getElementById(id);
link.style.color = farbe;
}

ein link:

<a href="#lightbox1" rel="lightbox1" id="link" class="lbOn" style="color:#000000" onclick="javascript:leuchten('link', '#FFFFFF');">780.49</a>

Vielen Dank