Fotorama:如何通过单击图像外部来取消全屏

Question

我想通过在图像外部单击来取消Fotorama'a全屏。Fotorama只允许退出全屏点击fotorama__fullscreen图标按钮。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
    fotoramaDefaults = {
      maxwidth: '100%',
      allowfullscreen: true,
      nav: 'thumbs',
      thumbwidth: '100',
      thumbheight: '100',
      thumbborderwidth: 0,
      thumbmargin: 3,
      click: false,
      swipe: false,
    };
</script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.js"></script>
<link  href="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.css" rel="stylesheet">
<div class="fotorama">
  <a href="http://s.fotorama.io/1.jpg" data-thumb="http://s.fotorama.io/1.jpg"></a>
  <a href="http://s.fotorama.io/1.jpg" data-thumb="http://s.fotorama.io/1.jpg"></a>
  <a href="http://s.fotorama.io/1.jpg" data-thumb="http://s.fotorama.io/1.jpg"></a>
  <a href="http://s.fotorama.io/1.jpg" data-thumb="http://s.fotorama.io/1.jpg"></a>
</div>

Answer 1

$('.fotorama').on('click', function (e, fotorama) {
    if ($(e.target).hasClass("fotorama__stage__frame")) {
        $('.fotorama').data('fotorama').cancelFullScreen();
    }
});