Problem mit FancyBox

W

wendan12

Grünschnabel
Habe da ein Problem mit der FancBox, der Inline link geht im Firefox nur 1 mal, danoch muss ich die Seite aktual. Im IE 8 geht er nicht der Iframe geht, ist aber auf kleinen Monitoren naja.... kann da bitte mal einer ueber den Code schauen ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/test praxis mit biss.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Unbenanntes Dokument</title>
<!-- InstanceEndEditable -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.3.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.3.css" media="screen" />
<link href="style/layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function() {
$("#various1").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});

$("#various3").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
</script>




<ul>
<li><a id="various1" href="#inline1" title="So finden Sie uns">Inline</a></li>
<li><a id="various3" href=http://maps.google.de/?ie=UTF8&ll=48.250283,9.810791&spn=2.593328,7.1356 2&z=8">Iframe</a></li>
</ul>
<div style="display: none;">
<div id="inline1"
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.de/?ie=UTF8&amp;ll=48.250283,9.810791&amp;spn=1.28022 9,2.334595&amp;z=8&amp;output=embed"></iframe><br /><small><a href="http://maps.google.de/?ie=UTF8&amp;ll=48.250283,9.810791&amp;spn=1.28022 9,2.334595&amp;z=8&amp;source=embed" style="color:#0000FF;text-align:left">Größere Kartenansicht</a></small>
</div>

THX
 
Hi,

es sieht so aus, als würde die URL aus dem src-Element des iframe-Tags genommen werden.

Versuch mal die URL beim Initialisieren zu sichern und in der onStart-Funktion wieder zuzuweisen:
Code: 
$("#various1").fancybox({
  'titlePosition' : 'inside',
  'transitionIn' : 'none',
  'transitionOut' : 'none',
  'hlp_url': $('#inline1 iframe').attr('src'),  // URL speichern
  'onStart': function(){
    // URL erneut zuweisen
    $('#inline1 iframe').attr({'src': this.hlp_url});
  }
});
Weiterhin solltest du dir deinen HTML-Code ansehen. Wenn das iFrame-Element mit einem A-Tag geschlossen wird, irgendwelche small-Elemente umherschwirren usw., sind Anzeigeprobleme nichts ausgeschlossen und schon gleich gar nicht einem Browser anzukreiden.

Ciao
Quaese
 
Mmmmmhhh, stehe da leider ein wenig auf dem Schlauch ( Bin seít ca. 1 Monat mit beschaeftigt mit HTML und CSS und mir brummt der Kopf).
Der Code von der Google Map ist der von Google, habe den auch auf der HP so. Nur wollte es abaendern, das die Karte nicht mehr zu sehen ist sondern per Link in der FancyBox erscheint.
Kann mir da einer weiter helfen ?
THX
 
Zuletzt bearbeitet:
Quaese hat gesagt.:
Hi,

es sieht so aus, als würde die URL aus dem src-Element des iframe-Tags genommen werden.

Versuch mal die URL beim Initialisieren zu sichern und in der onStart-Funktion wieder zuzuweisen:
Code: 
$("#various1").fancybox({
  'titlePosition' : 'inside',
  'transitionIn' : 'none',
  'transitionOut' : 'none',
  'hlp_url': $('#inline1 iframe').attr('src'),  // URL speichern
  'onStart': function(){
    // URL erneut zuweisen
    $('#inline1 iframe').attr({'src': this.hlp_url});
  }
});
Weiterhin solltest du dir deinen HTML-Code ansehen. Wenn das iFrame-Element mit einem A-Tag geschlossen wird, irgendwelche small-Elemente umherschwirren usw., sind Anzeigeprobleme nichts ausgeschlossen und schon gleich gar nicht einem Browser anzukreiden.

Ciao
Quaese
Zum Vergrößern anklicken....


Komme da echt nicht weiter, im Firefox macht er es jetzt, aber im IE net *heul*
 
Hi,

zum ersten ist das Pushen von Beiträgen unerwünscht.

Zum zweiten sollte vorausgesetzt werden können, dass auch ein HTML-Anfänger weiss, dass Tags geschlossen werden müssen, dass Anführungszeichen ebenso geöffnet und geschlossen werden müssen. Hier reicht Heulen zum Lösen des Problems allein einfach nicht aus.
Wenn du deinen HTML-Bereich durchgesehen hättest wäre dir sicherlich folgendes aufgefallen:
  • Hier fehlt im href-Attribut das offnende Anführungszeichen
Code: 
<a id="various3" href=http://maps.google.de/?ie=UTF8&ll=48.250283,9.810791&spn=2.593328,7.1356 2&z=8">
  • Hier fehlt die schliessende spitze Klammer (Grösserzeichen)
Code: 
<div id="inline1"
  • Hier fehlt das schliessende DIV-Tag
Code: 
<div style="display: none;">


Wegen derart banaler Fehler einen derartigen Wind zu machen, scheint für mich das Vergeuden von Ressourcen an der falschen Stelle zu sein. Und dem Helfenden bleibt immer der fade Beigeschmack, dass der Hilfesuchende gar kein wirkliches Interesse hat, das Problem selbst zu lösen.

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück