FancyBox 3で画像の高さを取得

Question

ファンシーボックスに入るイメージの高さを使用して、ファンシーボックスのIf/Thenを作成する際に問題があります。本質的には

setBigImage : function (slide) { 
var self = this; 
var $img = $('<img />'); 

slide.$image = $img 
.one('error', function() { 

self.setError(slide); 

}) 
.one('load', function() { 

slide.width = this.naturalWidth; 
slide.height = this.naturalHeight; 

.addClass('fancybox-image ') 
.attr('src', slide.src) 
.appendTo(slide.$content); 

、私は/場合は、画像の高さが500pxなどよりも大きいかどうかをチェックし.addClassの呼び出しの前に、次に追加していますよ。私は使用しようとしました：

if (slide.Width > 500) 
and if (this.NaturalHeight > 500) 

いずれも機能しませんでした。私はslide.Widthとthis.NaturalHeightの両方を、pタグの内部で試してみました。残念なことに、彼らは画像の2番目のインスタンスを作成しました。画像の高さを取得するにはどうすればよいでしょうか？

ご理解とご協力をいただきありがとうございます。

Answer 1

まず、この誤解を明確にしましょう。「残念なことに、彼らは画像の第2のインスタンスを作成しました。基本的なライトボックススクリプトを使用すると、サムネイルをクリックした直後にアイコンを読み込むと黒いオーバーレイが表示され、画像がポップアップします。しかし、fancyboxはサムネイル（最初の画像）を表示します。その後、実際の画像（2枚目の画像）が最初の画像の上に徐々に現れ、ユーザーは読み込みインジケータを見たり表示したりすることはほとんどありません。

あなたの質問への答えもシンプルで、ちょうどところで

if (slide.width > 500)

で

if (slide.Width > 500)

を置き換え、画像サイズに基づいて、よりカスタマイズできるようになりますfancyboxの次のバージョンを参照してくださいこれらのデモ - https://codepen.io/anon/pen/mqQLVm?editors=1010とhttps://codepen.io/anon/pen/yPQjbw?editors=1010