JQuery/Fancybox Klick nachstellen

danielmueller1985

Grünschnabel
Hallo zusammen,

ich habe ein Problem bei dem ich nicht weiter weiß und nicht weiter komme :(, ich hoffe jemand kann mir einen Tip geben.

das ist meine Situation:
Nutze auf einer Seite JQuery mit dem Fancybox Plugin für eine Lightbox. Nun gibt es einen Link der eine Lightbox öffnet. Der Link dazu wird aber vorher erst erstellt, d.h. es gibt ein Input Feld wo man etwas eintragen muss und beim Klick auf den Link wird das Feld überprüft und wenn die Eingaben richtig sind wird der Link in im a-tag eingesetzt und die Fancybox geht auf. Dabei wird der link (in etwa index.php?id=tuewas&variable=eingabe) erstellt und als iframe geöffnet, denn die lightbox soll dann das richtige anzeigen. So, mit einem Klick auf den Link funktioniert das auch prächtig.

Nun ist die Aufgabe dieses:
Wenn der Besucher die Eingabe im inputfeld macht und Enter drückt soll die Lightbox aufgehen. Nun bin ich soweit dass ich das Enter Event abfragen kann, aber ich bekomme es nicht hin dass die lightbox aufgeht, weil ich nicht weiß wie und was JQuery da macht.

So wird normalerweise über einen Click das ganze aufgerufen:
Code:
$("a.fancylink").fancybox({ 
  				'overlayShow': true,
  				'overlayOpacity':0.7,
  				'hideOnContentClick': false,
  				'centerOnScroll': true,
  				'zoomOpacity':true,
  				'frameWidth': 720,
  				'frameHeight': 505
  		});
Dabei wird noch die url aus dem href attribut mit übergeben.

Das einfachste wäre ja gewesen wenn es eine Möglichkeit gäbe per JS den Link klicken zu lassen, aber das geht ja nicht für alle Browser.

habe versucht in der Fancybox den aufruf über eine Neue Funktion selbst zu starten, d.h. ich gebe die url über parameter mit und lasse das build(); starten, allerdings fehlen dazu einige settings und ich weiß nicht wie und wo die herkommen.

Hat jemand eine Idee wie ich das machen könnte? Vielleicht gibt es ja noch eine einfache Möglichkeit?

Vielen Dank im Voraus!

Gruß
Daniel
 
Moin Daniel,


hier mal eine Variante:
Code:
<input id="fancyinput" title="Titel">
<script type="text/javascript">
$(document).ready(function() 
{

 $("input#fancyinput")
 .keypress(
            function (e) 
            {
              if (e.which == 13 )
              {
                e.target.href='index.php?id=tuewas&'+jQuery.param({'variable':$(e.target).val()});
                $(e.target).fancybox();
                $(e.target).click(
                                    function(e)
                                    {
                                      if(!e.which)
                                      {
                                        $(e.target).unbind('click');
                                      }
                                      
                                    }
                                  ).click();
                return false;
              }
            }
          );
});
</script>

Die Fancybox prüft ja nicht, ob das angeklickte Element ein Link ist...also sollte man das auch mit dem <input> machen können.
Beim Drücken der Enter-Taste wird das <input> mit dem nötigen href-Attribut versehen, so hat die Fancybox das, was sie braucht.
Dann wird das <input> noch per click() angeklickt, weil die Fancybox nur auf Klicks reagiert...das wars.
 
Hi,

das mit dem Enter hat ja super funktioniert. Jetzt hab ich ein Neues Problem, wie kann ich die Box bei einem mouseover auslösen?

Hab das nun so probiert:
Code:
$("a.zoom_image").mouseover(function() {
		$(this).fancybox();
		alert("test");
});

Bei einem Mouseover wird die Alertbox ausgegeben, aber die fancybox kommt nicht. Klick ich aber darauf, dann öffnet sich die Box.

Hast du vielleicht nochmal eine kleine Hilfe für mich?
Wäre Super :)

Gruß

Daniel
 
Zurück