1

zoomboxと呼ばれる(優れた)ライトボックスのようなプラグインにこのjQueryを使用しています:

        $('a.zoombox').zoombox({...});

aフォームのリンクを受け取りhttp://vimeo.com/15171582、vimeo id (15171582) を解析し、次のiframeURLをロードするライトボックスをポップアップ表示します。

http://player.vimeo.com/video/15171582?autoplay=1&title=0&byline=0&portrait=0&wmode=transparent

jQuery を変更して、モバイル ブラウザーで表示したときに、

  1. ライトボックスが起動しない
  2. 単純なリンクはリンクに変換されiframeますか?
4

1 に答える 1

5

これを使用できます: http://detectmobilebrowsers.com/モバイル デバイスを検出します。

または、次のようなウィンドウ幅を検出します。

function isMobile() {
   if(window.innerWidth <= 600) {
     return true;
   } else {
     return false;
   }
}

そして、次のようにレスポンシブにします。

// keep original url
$('a.zoombox').each(function() {
  var url = $(this).attr('href');
  $(this).data('url',url);
});

// on load
doMagic();

// resizing
$(window).resize(function() {
  doMagic();
});

// lightbox?
function doMagic() {
  $('a.zoombox').each(function() {
    var url = $(this).data('url');
    $(this).attr('href',url);
  });
  if (!isMobile) {
    $('a.zoombox').zoombox({...}); // lightbox here
  }
}

// detect mobile
function isMobile() {
  if(window.innerWidth <= 600) {
    return true;
  } else {
    return false;
  }
}

未検証

編集:ロード時にdoMagic呼び出しを追加..

于 2013-05-20T19:02:54.607 に答える