Verhindern Sie, dass Fotostreifen die Symbolleiste jemals ausblenden

Question

Ich verwende PhotoSwipe 3.0.4 mit jQueryMobile 1.1-rc1.

Ich versuche zu verhindern, dass PhotoSwipe seine Symbolleiste versteckt.

Ich habe versucht, die captionAndToolbarAutoHideDelay parameter auf 0 in der Hoffnung, dies würde verhindern, dass die Symbolleiste aus, aber dies scheint nur zu verhindern, dass es sich automatisch versteckt.

Ich setzte auch die captionAndToolbarHide zu false in der Hoffnung, dies würde verhindern, dass es versteckt, aber das hat nicht geholfen.

Ich möchte verhindern, dass die Symbolleiste versteckt, wenn dann der Benutzer tippt und Bilder wischt, wie auf einigen Handys ist es ein wenig schwierig, die Symbolleiste erneut angezeigt zu bekommen.

Hat jemand Glück dabei gehabt?

Answer 1

Aus dem Durchsuchen des Quellcodes here scheint es einige mögliche Optionen zu geben.

1. Aufschalten der OnFadeout oder fadeout Funktion in toolbar.class.js so, dass es nicht die Symbolleiste, die Sie auf eine Einstellung gesetzt basiert nicht Fadeout. Insbesondere durch Hinzufügen einer auf Einstellungen basierenden if-Anweisung um die folgende line.

2. Überschreiben oder fügen Sie zusätzliche Ereignislistener zu den OnBeforeJide- oder OnHide-Ereignissen hinzu, um die Ausblendung der Symbolleiste ein- oder auszublenden.

   Ein Beispiel eines benutzerdefiniertes Ereignis listner siehe here oder gar das OnHide Ereignis entfernen Util.Events.remove(this.toolbar,Toolbar.EventTypes.onHide, this.toolbarHideHandler); durch den Aufruf außerhalb der PhotoSwipe dispose-Methode.

3. Fügen Sie OnHide- oder OnBeforeHide-Ereignissen einen benutzerdefinierten Ereignishandler hinzu, der von dem Standardereignis übernimmt, aber das Ausblenden der Symbolleiste basierend auf einer von Ihnen festgelegten Einstellung stoppt.

Von dem, was ich

• das captionAndToolbarHide Variable sehen kann, ist standardmäßig falsch, und wenn auf true verhindert, dass die Toolbar gesetzt jemals in der CreateComponents Funktion erstellt werden.
• die captionAndToolbarAutoHideDelay Variable tut, dass es sagt, aber das verhindert nur das automatische Verbergen der Beschriftung und Symbolleiste, aber nicht alle anderen Ereignisaufrufe auf OnHide.
• Die Variable preventHide verhindert, dass der Benutzer photoSwipe schließt, garantiert aber nicht unbedingt, dass die Symbolleiste nicht ausgeblendet wird.

Weitere PhoneSwipe Dokumentation ist verfügbar here.

Answer 2

Ich musste verhindern, dass PhotoSwipe Bildbeschriftungen ausblenden, aber weiterhin Symbolleiste unten auf der Seite als normal ausblenden. Ich habe einfach die folgende CSS hinzugefügt, um Inline-Stile zu überschreiben, die PhotoSwipe zum Ausblenden dieses Elements anwendet. Sie können eine ähnliche Methode verwenden, um zu verhindern, dass die Symbolleiste ebenfalls ausgeblendet wird.

.ps-caption{ 
opacity:0.8 !important; 
display:block !important; 
} 

Answer 3

die folgende Codezeile hinzufügen Symbolleiste

.ps-toolbar{ 
    opacity:0.8 !important; 
} 

Answer 4

Sie müssen diese beiden Tags in Ihrem CSS permanent angezeigt werden:

.ps-caption{ 
opacity:0.8 !important; 
} 

.ps-toolbar { 
opacity:0.8 !important; 
} 

Answer 5

Ich verwende photoswipe im Diashow-Modus nur , die Fotos werden per Ajax-Aufruf geladen. Ich wollte, dass die Bildunterschrift dauerhaft am unteren Rand der Diashow angebracht wird. Das ist, was ich mir ausgedacht habe. Achten Sie auf die letzten beiden Zeilen:

instance.toolbar.showCaption(); 
    instance.toggleToolbar = function() {}; 

Dies zwingt die Beschriftung anzuzeigen, und dann überschreibt die Toggle-Funktion mit nichts. Ich hatte keine Fehler mit dieser Lösung.

loadSlideshow = function(items){ 


var options = { 
    captionAndToolbarOpacity: 0.9, 
    captionAndToolbarFlipPosition: true, 
    captionAndToolbarAutoHideDelay: 0, 
    captionAndToolbarShowEmptyCaptions: true, 
    preventHide: false, 
    enableKeyboard: false, 
    autoStartSlideshow: true, 
    target: $('#PhotoSwipeTarget'), 
    imageScaleMethod: 'fit', 
    preventHide: true, 
    margin: 0, 
    allowUserZoom: false, 
    backButtonHideEnabled: false, 
    //captionAndToolbarHide: true, 
    getImageSource: function(obj){ 
     return obj.url; 
    }, 
    getImageCaption: function(obj){ 
     return obj.caption; 
    } 
    }; 

    instance = window.Code.PhotoSwipe.attach(
    items, options 
); 

    instance.show(0); 
    instance.toolbar.showCaption(); 
    instance.toggleToolbar = function() {};       
    return true; 
} 

Answer 6

Um die ganze Zeit in der Symbolleiste angezeigt werden und jene Beschriftung über dem Skript entfernen, um zuerst:

this.caption.fadeOut(); 
this.toolbar.fadeOut(); 

dann

this.captionAndToolbar.fadeOut() 

Vorsicht, da zwei man versucht, ist dann die andere zu wissen ist was. Achtung ändern Sie den Link zur Website. Minuten die meiste Zeit.