3.5.x Akkordeon unterdrückt Popup in iframe

[kari]

Hallo,

ich habe ein Problem mit dem Inhalt in einem Akkordeon-Element (Umschlag). Hier habe ich einen iframe von einem externen Anbieter eingebunden (Travanto). Es handelt sich um einen Preisrechner für die Ferienwohnung. Er enthält einen Kalender zum Auswählen der An- und Abreise. Dieser öffnet sich mit einem Popup. Das funktioniert auch einwandfrei, solange das Element nicht innerhalb des Akkordeon-Umschlags liegt. Sobald ich es dort reinlege, öffnet sich das Popup nicht mehr.

Hier der Link zur Seite ... bitte runterscrollen und auf "PREISRECHNER" klicken:
http://web.nordseeurlaub-sylt.de/few...imathafen.html

Hier der eingebundene Code:

<b id="preisrechner_iframe_child">Preisrechner für  Ferienwohnen am Meer im Haus Nordland Wenningstedt Sylt WHG 4</b><br />
<script language="javascript" type="text/javascript" src="http://www.travanto.de/js/index.externInclude.js">
</script>
<script language="javascript" type="text/javascript">
    includePreisrechner.width		=	800;
    includePreisrechner.height		=	679;
    includePreisrechner.allg_http	=	'http://www.travanto.de';
    includePreisrechner.objekt_nr	=	1015962;
    includePreisrechner.lang		=	'de';
    includePreisrechner.objekt_url	=	'http://www.travanto.de//ferienwohnungen/wenningstedt/1015962/ferienwohnen-am-meer-im-haus-nordland-wenningstedt-sylt-whg-4.php';
    includePreisrechner.createIframe();
</script>

Ich hoffe, Ihr habt eine Idee. <iframe> und <script> habe ich natürlich bei den erlaubten Tags eingebunden. ;-)

Viele Grüße
Kari

[Andreas]

Ich habe den Code mal korrigiert und das Script richtig gewrappt.

<b id="preisrechner_iframe_child">Preisrechner für Ferienwohnen am Meer im Haus Nordland Wenningstedt Sylt WHG 4</b>
<br>

// versuche hier von https zu laden, falls du mal auf https umstellst, sonst geht das dann nicht mehr
// das bräuchte IMHO auch nur einmal geladen werden auf der Seite und nicht 3 mal
<script src="http://www.travanto.de/js/index.externInclude.js"></script>

<script>
  (function($) {
    $(document).ready(function() {

      includePreisrechner.width      = 800;
      includePreisrechner.height     = 679;
      includePreisrechner.allg_http  = 'http://www.travanto.de'; // https!
      includePreisrechner.objekt_nr  = 1015962;
      includePreisrechner.lang       = 'de';
      includePreisrechner.objekt_url = 'http://www.travanto.de//ferienwohnungen/wenningstedt/1015962/ferienwohnen-am-meer-im-haus-nordland-wenningstedt-sylt-whg-4.php'; // https!
      includePreisrechner.createIframe();

    });
  })(jQuery);
</script> 

Das Akkordeon ist ja auch nur normales HTML. Das einzige was ich mir vorstellen kann, warum das nicht funktioniert ist, weil die Zugeklappten auf display:none; stehen. Wenn es also mit meinem Code immer noch nicht funktioniert, dann darfst du dieses Script also erst starten, nachdem das Akkordeon aufgeklappt ist. Schematisch so in etwa:

<script>
  (function($) {
    $(document).ready(function() {

      Accordion.onComplete(function(){ // reine Spekulation
        includePreisrechner.width      = 800;
        includePreisrechner.height     = 679;
        includePreisrechner.allg_http  = 'http://www.travanto.de'; // https!
        includePreisrechner.objekt_nr  = 1015962;
        includePreisrechner.lang       = 'de';
        includePreisrechner.objekt_url = 'http://www.travanto.de//ferienwohnungen/wenningstedt/1015962/ferienwohnen-am-meer-im-haus-nordland-wenningstedt-sylt-whg-4.php'; // https!
        includePreisrechner.createIframe();
      });

    });
  })(jQuery);
</script> 

[kari]

Hallo Andreas,

danke für den Versuch. Leider sind mit dem geänderten Script alle Akkordeons auf der Seite aufgeklappt und der Preisrechner funktioniert gar nicht mehr. Wobei deine Vermutung mit display: none schon sehr einleuchtend klingt.

Vielleicht hat noch jemand eine Idee??

Ansonsten schon mal ein schönes Wochenende
Kari

[Andreas]

Leider sind mit dem geänderten Script alle Akkordeons auf der Seite aufgeklappt und der Preisrechner funktioniert gar nicht mehr.

Dann musst du erstmal ein wenig auf Fehlersuche gehen. In der Konsole mit den Devtools (F12). Da wird erstmal ein JS-Fehler sein. Die Akkordeons sind aufgeklappt, weil dieses HTML ohne JS einfach so aussieht.

Du darfst natürlich nicht "Accordion.onComplete()" benutzen (bezweilfle dass dies richtig ist). Da musst du recherchieren wie das geht mit dem jQuery Accordion. Ok, habe nachgesehen: Die Option (Funktion) activate: im Initialisierungsscript wird jedesmal aufgerufen, wenn ein Aufklappen abgeschlossen ist.

Schau nochmal in die Doku von Travanto oder hole dir einen Experten dazu. Du solltest auch meinen korrigierten Code benutzen und die Quelle mit https aufrufen. Dann https://www.travanto.de/js/index.externInclude.js nur einmal einbinden und zwar wahrscheinlich am besten erst nach dem Akkordeon.