2013-01-04 9 views
8

Ich benutze fancybox auf einer Seite, aber ich benutze es als mehr eine Design-Funktion als ein jQuery modal. Ich versuche, den Benutzer daran zu hindern, es zu schließen (da es das Design der Seite "brechen" wird). Es ist mir gelungen, den Benutzer davon abzuhalten, aus der fancybox heraus zu klicken, aber ich habe Probleme, die Datei zu schließen, wenn die Esc-Taste gedrückt wird. Ich habe versucht 'closeOnEscape': false, aber das scheint nicht zu funktionieren. Unten ist mein Code. Irgendwelche Vorschläge, was ich falsch mache oder was ich tun muss?Stop fancybox schließen, wenn Benutzer Esc drückt

$(document).ready(function() { 
    $.fancybox({ 
     'width': '340px', 
     'height': '100%', 
     'autoScale': true, 
     'transitionIn': 'none', 
     'transitionOut': 'none', 
     'type': 'iframe', 
     'href': 'form.php', 
     'hideOnContentClick': false, 
     'closeBtn' : false, 
     'helpers' : { 
      'overlay' : { 
       'closeClick': false, 
      } 
     } 
    }); 
}); 
+1

Welche Version von fancybox verwenden Sie? – lnrbob

+0

Das wird Ihnen nicht helfen, aber wenn Sie es als Design-Feature verwenden, ist es wahrscheinlich einfacher, etwas ähnliches (visuell) zu bauen – Damien

+0

http://stackoverflow.com/questions/3000884/why-is-it-when-i -set-closeonescape-to-false-und-dann-closeonescape-to-true-j – Arpit

Antwort

14

Überprüfen Sie die keys Option fancyBox docs:

Tasten
Tastaturtasten für Galerie Navigation definieren, Schließen und Diashow
Objekt; Standardwert:

{ 
    next : { 
     13 : 'left', // enter 
     34 : 'up', // page down 
     39 : 'left', // right arrow 
     40 : 'up' // down arrow 
    }, 
    prev : { 
     8 : 'right', // backspace 
     33 : 'down', // page up 
     37 : 'right', // left arrow 
     38 : 'down' // up arrow 
    }, 
    close : [27], // escape key 
    play : [32], // space - start/stop slideshow 
    toggle : [70] // letter "f" - toggle fullscreen 
} 

Karte einfach den close Wert null.


Wenn Sie fancyBox2 verwenden, fügen Sie diese Eigenschaft, um Ihren Code:

$.fancybox({ 
    // all your other options here 
    ..., 
    keys : { 
    close : null 
    } 
} 
+0

Können Sie den Code, den ich brauche, in meinen bestehenden Code integrieren? Ich habe wirklich keine Erfahrung mit Javascript oder fancyBox –

+0

Meine Bearbeitung jetzt sehen. – moonwave99

+1

Seltsamerweise funktionierte diese Antwort nicht für mich. Ich fand, dass 'modal: true,' zu funktionieren scheint –

2

@ moonwave99 hat die richtige Antwort für fancybox2. Wenn Sie v1.3 verwenden + dann müssen Sie verwenden:

enableEscapeButton: false 

Ref: http://fancybox.net/api

0

Wie andere in den Kommentaren, modal: true funktioniert perfekt ...

$.fancybox({ 
    modal: true 
}); 

Von the docs... erwähnt haben

modal - Wenn diese Option auf "true" gesetzt ist, werden die Navigation und das Schließen deaktiviert.

Verwandte Themen