Wie blockiere ich die Benutzeroberfläche mit JQuery UI?

Ich habe dieses Plugin wurde über die Benutzeroberfläche zu blockieren: http://jquery.malsup.com/block/Wie blockiere ich die Benutzeroberfläche mit JQuery UI?

Das Plugin funktioniert hervorragend, es ist nur, dass ich nicht schon so etwas zu tun hat, wenn jQuery UI enorm wäre überrascht, da es tun müssen Das Gleiche gilt für die Dialog-Funktion.

Wie blockiert man die Benutzeroberfläche mit JQuery UI?

Quelle

2010-10-25 Billy ONeal

Was ist los mit der Verwendung des BlockUI-Plugins? Es ist ziemlich leicht. –

@Alastair: Nichts - mehr von einem Gedankenexperiment ist alles. Es ist ein tolles Plugin, –

Sie könnten etwas Hacky tun - rufen Sie das Modal, dann auf die onopen Rückruf, remove() das modale selbst.

$("#something").dialog({ 
    open: function(event, ui) { $('.ui-dialog').remove(); } 
});

Hey! Ich sagte, es Hacky :)

oder

Untersuchen Sie den Modal-Code ist und sehen, ob es eine Funktion aufruft, die Benutzeroberfläche zu blockieren. Vielleicht könnten Sie eine externe Referenz hinzufügen, damit Sie sie selbst anrufen können.

oder

HTML In den Sie dokumentieren und show() oder hide() auf es nennen.

<div class="ui-widget-overlay" style="width: 100%; height: 100%; z-index: 32767;"></div>

oder (wenn Sie nicht sicher sind, wie sie gemacht werden)

Sie sind einfach div (allgemein) absolut positioniert und 100% height/width, mit einem hohen z-index und in der Regel eine opacity (schau dir an, wie man es in IE6 mit Filtern macht).

Sie können es auch auf position: fixed setzen, so dass es immer dort sein wird, wenn Sie blättern. Sie können die Bildlaufleisten auch ausblenden, wenn Sie möchten, indem Sie $('body').css({ 'overflow-y': 'hidden' }) tun.

Quelle

2010-10-25 02:49:24 alex

+1: Mehrere verschiedene interessante Methoden. – Kranu

Um die Benutzeroberfläche zu "blockieren", fügen Sie einfach ein absolut positioniertes div mit einem hohen z-index und der gewünschten Hintergrundfarbe und Deckkraft ein, so dass es die ganze Seite abdeckt.

Quelle

2010-10-25 02:50:50

Ich denke, er weiß * wie *, aber * kann * er es mit jQuery UI tun? d. h. nicht seinen eigenen Code und CSS schreiben. – alex

@Alex: Eigentlich habe ich nicht :(Aber dein Punkt ist gültig. –

Whoops, mein Fehler! – alex

jQuery habe nur einen Fortschrittsbalken, wie ich weiß. Natürlich können Sie alles oben tun, aber es scheint zu kompliziert zu verwalten, wenn Sie mit dem vergleichen, was Sie bereits verwenden.

Mein recommandation ist, zu versuchen jQuery Block UI

wirklich sauber zu ändern und viele CSS-Optionen. Einfach zu verwenden und in jedem Projekt zu implementieren.

Quelle

2012-03-15 14:01:18

@BillyONeal Ich glaube, du hast meine Antwort nicht gelesen: "Was du schon benutzt hast" ist vor deinen Augen –

Die Frage lautet: "Ich benutze dieses Plugin, um die Benutzeroberfläche zu blockieren.Wie würde ich die Verwendung von nur jQuery UI-Komponenten (anstatt dieses Plugins) implementieren? "Ihre Antwort lautet:" Versuchen Sie, dieses Plugin zu verwenden, das Sie explizit in der Frage " –

" angegeben haben. Sprechen wir hier über englische Grammatik oder programmieren? Ich denke, ist unhöflich zu wählen, nur weil Sie nicht den Punkt bekommen. –

<div id="__messageBox_wait" class="messageBoxArea" style="display: none; cursor: default"> 
       <div> 
        <label id="__messageBox_wait_text" style="vertical-align: middle"> 
         Please wait</label> 
       </div> 
</div> 

function blockUI() { 
     var boxHtml = $('#__messageBox_wait'); 
     var message = "Please wait..."; 
     $('#__messageBox_wait_text').text(message); 
     $.blockUI({ 
      theme: false, 
      title: 'Message', 
      message: boxHtml, 
      css: 'width:15%' 
     }); 
    } 


    $.unblockUI(); -- call to Unblock UI 
    blockUI(); --- call to block UI

Quelle

2015-10-13 11:52:46

Wie blockiere ich die Benutzeroberfläche mit JQuery UI?

Antwort

Verwandte Themen