Lightbox funktioniert nicht

**AndreasF** · 04.09.2010, 11:56

Hi,

Ich habe bereits die Suchfunktion benutzt, und habe auch ein paar ähnliche Probleme gefunden, aber bin trotzdem noch auf keinen grünen Zweig gekommen...

Es geht um folgende Seite:
http://www.razkoo.at/portfolio/index...eferenzen.html

Da habe ich eine Galerie als Inhaltselement. Wenn man auf ein Bild klickt, sollte es eigentlich in einer Lightbox vergrößert werden. Tut es aber, wie man sieht, nicht. Das merkwürdige ist, dass ich bei anderen Typolight - Projekten dieses Problem nie hatte (selbst mit der selben Version). Ich habe in meinem Layout den Haken bei "moo_slimbox" gesetzt. Ich binde Mootools mit diesen 2 Zeilen im Header in meinem Template ein:

HTML-Code:

<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>

Ich habe auch schon die Lightbox "slimbox2" mit der jQuery - Api versucht, das ging auch nicht...

Mein template (fe_page.tpl) sieht so aus:

HTML-Code:

<?php echo $this->doctype; ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>">
<head>
<base href="<?php echo $this->base; ?>"></base>
<title><?php echo $this->pageTitle; ?> - <?php echo $this->mainTitle; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $this->charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="description" content="<?php echo $this->description; ?>" />
<meta name="keywords" content="<?php echo $this->keywords; ?>" />


<?php echo $this->robots; ?>
<?php echo $this->framework; ?>
<?php echo $this->stylesheets; ?>

<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>
<?php echo $this->head; ?>
</head>

<body id="top"<?php if ($this->class): ?> class="<?php echo $this->class; ?>"<?php endif; if ($this->onload): ?> onload="<?php echo $this->onload; ?>"<?php endif; ?>>
<div id="container">
    <div id="upper-page" style="clear:both;">
        <img src="tl_files/img/header-logo.png" alt="logo" />
        <?php echo $this->header; ?>
    </div>
    
    <div id="content">
           <div id="left"><?php echo $this->main; ?></div>
           <div id="c_right"><?php echo $this->right; ?> </div>
    </div>
</div>
</body>
</html>

Ich rätsel schon den ganzen Tag, was falsch sein könnte, aber ich finde einfach nichts. Es wäre schön, wenn mir jemand helfen könnte

Grüße,

Andreas F.

**ways2web** · 04.09.2010, 12:23

hi,

zuerst mal is dein css fehlerhaft, nach " helvetica" fehlt ein ;

HTML-Code:

content h1,h2{font-family:Impact, arial, helveticafont-size:18px;text-shadow: -1px -1px 0px #9a9898, 1px 1px 0px #fff;color:#d6d3d3;letter-spacing:-1px;margin-bottom:-15px;}

willst du die normale lightbox nutzen? wieso nicht die lightbox4ward... damit hab ich nie probleme

gruss
ways

**Nils Riel** · 04.09.2010, 12:51

Dir fehlt am Ende der fe_page.tpl die Initialisierung der Lightbox/Slimbox/Mediabox/whatever :P

ersetze:

HTML-Code:

</body>

mit:

HTML-Code:

<?php echo $this->mootools; ?>
</body>

**AndreasF** · 04.09.2010, 12:52

Hi,

Danke, ich werd den Fehler in der CSS gleich mal fixen.

Welche Lightbox ist mir eigentlich egal, hauptsache irgendeine. Lightbox4ward hab ich auch schon ausprobiert, selbes Problem. (Also die Bilder öffnen sich nicht in einer Lightbox sondern eben in einem Browserfenster.

EDIT:
@Nils:
DANKE! Es funktioniert. Tja, manchmal sieht man den Wald halt vor lauter Bäumen nicht. Und das hat mich den ganzen Vormittag beschäftigt...

Vielen Dank! Für mich ist das Thema erledigt.

**Nils Riel** · 04.09.2010, 13:57

Kein Ding. Als guten Rat kann ich dir ans Herz legen die Standard-Templates standard sein zu lassen und nicht zu bearbeiten. Bei deiner Seite brauchst du kein modifiziertes Template.

**waschbecken1394** · 20.09.2010, 14:40

Hallo!

habe das selbe Problem bei mir hier mein template:

HTML-Code:

<?php echo $this->doctype; ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>">
<head>
<base href="<?php echo $this->base; ?>"></base>
<title><?php echo $this->pageTitle; ?> - <?php echo $this->mainTitle; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $this->charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="description" content="<?php echo $this->description; ?>" />
<meta name="keywords" content="<?php echo $this->keywords; ?>" />
<?php echo $this->robots; ?>
<?php echo $this->framework; ?>
<?php echo $this->stylesheets; ?>

<link rel="shortcut icon" href="favicon.ico" />
<link rel="stylesheet" href="tl_files/template/valeo_basic.css" type="text/css" media="screen" />
<link rel="stylesheet" href="tl_files/template/valeo.css" type="text/css" media="screen" />
<link rel="stylesheet" href="plugins/mediabox/css/mediabox.css" type="text/css" media="screen" /> 
<link rel="stylesheet" href="plugins/slimbox/css/slimbox.css" type="text/css" media="screen" /> 
<link rel="stylesheet" href="tl_files/template/js/orbit.css" />	

<script type="text/javascript" src="plugins/mediabox/js/mediabox.js"></script> 
<script type="text/javascript" src="plugins/slimbox/js/slimbox.js"></script> 
<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>
<script type="text/javascript" src="tl_files/template/js/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="tl_files/template/js/jquery.orbit.js"></script>

<?php echo $this->head; ?>
</head>

<body id="top"<?php if ($this->class): ?> class="<?php echo $this->class; ?>"<?php endif; if ($this->onload): ?> onload="<?php echo $this->onload; ?>"<?php endif; ?>>
<div id="wrapper">
<?php if ($this->header): ?>

<div id="header">
<?php echo $this->header; ?> 
</div>
<?php endif; ?>
<?php echo $this->getCustomSections('before'); ?>

<div id="container">
<?php if ($this->left): ?>

<div id="left">
<div class="inside">
<?php echo $this->left; ?> 
</div>
</div>
<?php endif; ?>
<?php if ($this->right): ?>

<div id="right">
<div class="inside">
<?php echo $this->right; ?> 
</div>
</div>
<?php endif; ?>

<div id="main">
<div class="inside">
<?php echo $this->main; ?> 
</div>
<?php echo $this->getCustomSections('main'); ?> 
<div id="clear"></div>
</div>

</div>
<?php echo $this->getCustomSections('after'); ?>
<?php if ($this->footer): ?>

<div id="footer">
<div class="inside">
<?php echo $this->footer; ?> 
</div>
</div>
<?php endif; ?>

<!-- indexer::stop -->
<img src="<?php echo $this->base; ?>cron.php" alt="" class="invisible" />
<!-- indexer::continue -->
<?php echo $this->mootools; ?>

</div>
<?php if ($this->urchinId): ?>

<script type="text/javascript" src="<?php echo $this->urchinUrl; ?>"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
try {
var pageTracker = _gat._getTracker("<?php echo $this->urchinId; ?>");
pageTracker._trackPageview();
} catch(err) {}
//--><!]]>
</script>

<?php endif; ?>

</body>
</html>

Habe ebenso noch einen weiteren JQuery Effekt eingebaut, jedoch wenn ich diesen wieder ausbaue klappt die Lightbox leider noch immer nicht.

Hat wer eine Idee?

http://dev.the-webring.at/valeo-inve...p/Konzept.html
user/pwd: guido/development

Sobald ich auf das Bild (Vermögensverwalter xyz) klicke, wird die JPG Datei geöffnet und der Lightbox Effekt erscheint nicht. Hat aber schon mal funktioniert, doch nun steh' ich leider an.

**waschbecken1394** · 20.09.2010, 15:21

1) In meinem Template waren die MooTools-Templates nicht angehakt, es werden wohl keine DomEvents erzeugt

2) Die Reihenfolge ist anscheinend doch entscheidend durch mein weiteres Plugin.

In dem Sinn so:

HTML-Code:

 ...
<?php echo $this->stylesheets; ?>

<link rel="shortcut icon" href="favicon.ico" />
<link rel="stylesheet" href="tl_files/template/valeo_basic.css" type="text/css" media="screen" />
<link rel="stylesheet" href="tl_files/template/valeo.css" type="text/css" media="screen" />
<link rel="stylesheet" href="plugins/mediabox/css/mediabox.css" type="text/css" media="screen" /> 
<link rel="stylesheet" href="plugins/slimbox/css/slimbox.css" type="text/css" media="screen" /> 
<link rel="stylesheet" href="tl_files/template/js/orbit.css" />	

<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>

<script type="text/javascript" src="tl_files/template/js/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="tl_files/template/js/jquery.orbit.js"></script>

<?php echo $this->head; ?>
...

**bitman** · 22.07.2011, 09:18

Habe ebenfalls gesucht, warum bei mir die Lightbox nicht funktionierte.
Der Initialisierungsstring in fe_page.tpl war vorhanden.
Live-HTTP-Headers zeigte auch, dass die JS-Dateien gefunden wurden.

Ich hatte daher erst den Browser in Verdacht (Entschuldigung Browser), weil ich Iceweasel auf Debian 6 benutze...

Aber:
Im Theme war unter
MooTools-Templates überhaupt nichts aktiviert.

Den Haken gesetzt, und schon spielt auch die Lightbox

[x] moo_mediabox
[ ] moo_accordion
[ ] moo_ analytics
[ ] moo_slimbox

So langsam kommt Land unter die Füße ...

**Flaschenzug** · 10.10.2011, 16:21

So, dann komme ich auch noch mal mit einem ähnlichen Problem an ...
http://www.slackliner-berlin.de/slac...line-2011.html

Und zwar ging die Lightbox (Mootools) bis vor kurzem noch.
Gerade habe ich festgestellt, dass dies nicht mehr der Fall ist.

Da ich kürzlich die "social 2 click privacy" Buttons manuell eingebaut habe, erst mal auf die geschaut - und ja, damit hängt es zusammen.
In dem "fe_page" Template habe ich dafür die folgenden zwei Javascript's eingefügt:

Code:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type="text/javascript" src="system/modules/social-2click/jquery.socialshareprivacy.js"></script>
<?php echo $this->mooScripts; ?>

Wenn ich diese nun auskommentiere, dann geht die Lightbox (moo_mediabox).
Nehme ich eins von beidem raus, geht es wieder nicht mehr - dabei ist es egal welches.

Ich habe auch versucht ob es an der Reihenfolge liegt und folgendes vertauscht, was aber leider auch nichts bewirkt hat:

Code:

<?php echo $this->mooScripts; ?>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type="text/javascript" src="system/modules/social-2click/jquery.socialshareprivacy.js"></script>

Hat jemand von euch eine Idee woran das liegen könnte ?
Vielen Dank und eine gute Woche euch.

Jonas

**Flaschenzug** · 15.10.2011, 09:01

So, ich habe mich ebend noch mal ein bisschen mit dem Thema auseinander gesetzt und bin auf folgendes Problem - und die entsprechende Lösung gestoßen.

Das Problem:
Bei Mootools und jQuery überschreiben sich einige Funktionen.
Entsprechend kann natürlich nicht beides funktionieren.

Quelle: http://www.wpshoppe.com/2008/12/24/w...-and-mootools/

Die Lösung:
Ist die noConflict Version von jQuery

Code:

jQuery.noConflict();

Quelle: http://docs.jquery.com/Using_jQuery_...ther_Libraries

Erst jQuery einbinden, dann die noConflict Zeile.
Und danach MooTools.

Dann sollten beide Api's parallel laufen.

**sebhoff** · 10.11.2011, 15:33

Hallo Community.

Tut mir Leid das ich den Beitrag ausgrabe, aber ich wollte da (noch) keinen extra Thread für eröffnen.

Ich habe nun eine frische Contao 2.10.3 Installation und wollte mit der "Lightbox4ward" einen Artikel öffnen lassen.
Die Mootools im Theme wurden auf Lightbox4ward gestellt, der Artikel wurde als ein Lightbox Element eingefügt was testweise erstmal ein Bild öffnen soll.
Leider wird beim klicken auf den Link immernoch eine Seite in der Hauptspalte angezeigt.

ich hab jetzt die fe_page.tpl verzweifelt gesucht, finde aber nur eine fe_page.html5 - wo scheinbar die mootools eingebettet sind, da der Eintrag

PHP-Code:


<?php echo $this->mootools; ?>

mehrfach vorhanden ist...
contao-check.php ergab keine corrupten Files.

ich bin mir (fast) sicher das das nur ein ganz blöder Fehler ist... aber vielleicht kann mir ja einen nen Tip geben.
URL ist: www.goldene-krone.net
der Link Startseite -> Aktuelles sollte ein Bild in der Lightbox öffnen - hier gehts nich
ebenfalls ein Klick auf die Tafel "Mittagsmenü" -> hier funktioniert nur die Hälfte (s.u.)

Sollte eine Ligtbox nicht direkt aus dem Navigationsmenü geöffnet werden können ist das auch kein Problem, auf der Startseite kann ich auch den Link der Tafel "Mittagsmenü" verwenden - hier funktioniert das aber komischerweise NUR bei Bilddateien.

Gebe ich einen Artikel an erhalte ich einen "page not found"
gebe ich den Artikel an, der ein Lightbox4ward Element ist wird die gesamte Seite mit komplettem Layout in der Lightbox angezeigt - aber weder ein Artikel, noch ein Bild.

Vielleicht kann mir ja einer einen Ratschlag geben, oder ein Extension emfpehlen was besser zu meinen Bedürfnissen passt.

LIebe Grüße,

sebhoff.

**AndiK** · 15.11.2011, 16:36

Zitat von Flaschenzug

…

Das Problem:
Bei Mootools und jQuery überschreiben sich einige Funktionen.
Entsprechend kann natürlich nicht beides funktionieren.

Quelle: http://www.wpshoppe.com/2008/12/24/w...-and-mootools/

Die Lösung:
Ist die noConflict Version von jQuery

Code:

jQuery.noConflict();

Quelle: http://docs.jquery.com/Using_jQuery_...ther_Libraries

Erst jQuery einbinden, dann die noConflict Zeile.
Und danach MooTools.

Dann sollten beide Api's parallel laufen.

Wo genau muss das denn eingebaut werden?

lg
Andi

**AndiK** · 16.11.2011, 10:48

Hmmm, jetzt bin ich ganz ratlos:

Auf meinen anderen Contao-Installationen funktioniert die Lightbox auch, obwohl ich sonst nichts verändert oder ergänzt habe.

Woran kann es denn noch liegen, dass die Lightbox nicht "anspringt"?

***xchs*** · 16.11.2011, 15:37

Kann man sich das irgendwo ansehen? Gibt es vielleicht Skript-Fehler? Steht hierzu etwas in der Konsole?

**AndiK** · 16.11.2011, 15:41

Ja, und zwar hier…

Im unteren Teil der Seite ist eine Galerie, die eigentlich über die Lightbox laufen sollte.

Die Seite ist noch im Alphastadium…

***xchs*** · 16.11.2011, 15:46

Das MenuMatic-Skript wird nicht gefunden: http://mutters-bester-tropfen.de/tl_...atic_0.68.3.js
Vielleicht liegt es daran.

**AndiK** · 16.11.2011, 16:03

Ich fasse es nicht…

Wie kann man nur so doof sein und das Wichtigste vergessen?

DANKESCHÖÖÖN!

Immer wieder beruhigend, dass es hier nette und vor allem intelligentere Menschen gibt, die einem "Blödmannsgehilfen" wie mir aus der Patsche helfen…