Zum Hauptinhalt springen

Modal-Box Popup erstellen in Joomla! 2.5

In diesem Artikel wird beschrieben wie in Joomla 2.5.x Links erzeugt werden können deren Inhalte in einer Modalbox geöffnet werden.

Als erstes muss in die Index.PHP des verwendeten Templates folgendes eingefügt werden:

JHTML::_('behavior.modal'); 

Dieser Quellcode muss direkt in den oberen Bereich vor dem ersten "?>" eingefügt werden.

Link als Modalbox

<a href="http://www.example.com/images/myimage.jpg" class="modal">Hier Klicken fürs Bild</a>

<a class="modal" href="/joomla-handbuch?amp;id=23&amp;tmpl=component&amp;task=preview" rel="{handler: 'iframe', size: {x: 680, y: 370}}">Abrechnung</a>

Auf diese Art und Weise können Bilder einfach in einer Modalbox dargestellt werden.

Texte in Modalbox darstellen

<div  style="display: none;">

<div id="loadDiv">

  A div element containing some text that you want to display.

</div>

</div>

Wichtig ist das umgebende Div mit display none, so dass der Text nicht sofort sichtbar ist

<a href="#loadDiv" class="modal">Hier Klicken fürs Popup</a>