✔ jQuery: openPopupLayer

messmar

messmar

Erfahrenes Mitglied
Hallo zusammen,

ich verwende die folgende jQuery-Methode:
HTML: 
$.openPopupLayer({
    name: "contactForm",
    width: 300,
    url: "contact_form.html",
    success: function() {
        alert("It is loaded");
    }
});

jQuery Plugins

um einen Layer automatisch aufrufen zu können.
Es funkt. aber nur solange man keine externe URL aufruft. z.B. http://www.xxxxxx.yy
ich bekomme keinen Fehler oder Ähnliches.

Hat Jemand ne Idde oder Erfahrung damit schon mal gemacht?

Vielen Dank und Gruß
Messmar
 
Hi,

im Hintergrund wird ein Ajax-Request ausgeführt, der den HTML-Content besorgt. Hier gilt jedoch die Richtlinie der gleichen Herkunft (same origin policy), die besagt, dass der Zugriff nur auf Inhalte erfolgen darf, die sich unter der gleichen Domain befinden.

[EDIT]
Erreichen könntest du das gewünschte Verhalten, indem du einen iFrame im Dokument versteckst. Diesem kann die gewünschte URL zugewiesen werden.
Die Anzeige über das PlugIn erfolgt dann jedoch über die Eigenschaft target.

Beispiel:
Code: 
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="jquery.jmpopups-0.5.1.js" type="text/javascript"></script>
<script type="text/javascript">
  <!--
function openPopUp(strUrl){
	$('#iframe_id iframe').attr({
  	src: strUrl
  });

  $.openPopupLayer({
      name: "contactForm",
      width: 300,
      target: "iframe_id"
  });
}
 //-->
</script>
</head>
<body>
<button onclick="openPopUp('http://www.canvas.quaese.de/');">openPopUp</button>
<div style="display: none;"><div id="iframe_id"><iframe src=""></iframe></div></div>
</body>
</html>
[/EDIT]

Ciao
Quaese
 
Zuletzt bearbeitet:
Danke Quase,

heißt das, dass es keine Lösung für sowas gibt bzw. man ein PopUpLayer mit jQuery (externe URL)
nicht umsetzen kann?

Gruß
Messmar
 
Vielen Dank.

Nur die externe Seite muss beim laden der Seite aufgerufen werden u. nicht bei dem EventHandler:
HTML: 
onclick
.

Nun habe ich die Funktion so im Body aufgerufen:
HTML: 
openPopUp('http://www.canvas.quaese.de/');
aber dann kommt ein Null zurück statt das iFemar mit der Seite.

Gruß
Messmar
 
Hi,

schon versucht, die Seite im onload-Event zu laden?
Code: 
$(function(){
	openPopUp('http://www.canvas.quaese.de/');
});
Ciao
Quaese
 
Hi Quase,

vielen Dank ;-) es scheint zu funkt. ich teste es noch mal aufm Server.
Auf die Idde bin ich nicht gekommen... (der Aufruf des PopUps über die Funktion von jQuery).

G
Messmar
 
Hi Quase,

noch ne Frage bitte: ich veersuche zu vernlassen, dass der User den LAyer über einen Link sclhiessen kann bzw. wieder verstecken kan und zwar mit:
HTML: 
<div style="display:none;" id="xxxxx">
            <div id="iframe_id">
                <span><a href="javascript:void(0);" onclick="document.getElementById('xxxxx').style.display = 'none';">CLOSE</a></span>
                <iframe src="" width="1000" height="900" style="margin:0 auto; padding:0; background-color:#fff; border:0;"></iframe>
            </div>
        </div>

Es funkt. aber leider nicht... wusstest du evtl. bitte, wie man in diesem Fall sowas bewerkstilligen kann?

Vielen Dank und Gruß
Messmar
 
Hi,

die API des PlugIns hält hierfür die Methode closePopupLayer bereit. Als Argument wird der Name des PopUps erwartet (wird beim Öffnen über die Option name übergeben).

Mit dem Beispiel von gestern und deinem Code könnte es wie folgt aussehen:
Code: 
<span><a href="#" onclick="$.closePopupLayer('contactForm'); return false;">CLOSE</a></span>
Ciao
Quaese
 
Super Quase u. Danke!

ich habe es auch einigemaßen angepasst und die
HTML: 
jQuery.noConflict()
Methode hinzugefügt, da ich sonst Konflikte mit anderen Bibliotheken bekomme.

Ich habe es in ner Funktion eingepackt und dann im TextLink aufgerufen... Der Code sieht so aus:

HTML: 
function closePopUp(){
       jQuery.noConflict();
       jQuery(document).ready(function($){$.closePopupLayer('contactForm'); return false;});
}

Aufruf:
HTML: 
<div style="display:none;">
       <div id="iframe_id">
            <span class="closeSpan">
                  <a href="#" onclick="closePopUp();" style="color:#fff;">CLOSE</a>
            </span>
            <iframe src="" width="1000" height="900" class="disclaimerTeaser"></iframe>
        </div>
</div>

Vielen Dank und Gruß
Messmar
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück