发表新帖
发表新帖

Call fotorama gallery in full screen mode via API

后端 未结
关注
2 597
北荒
北荒 2021-01-07 00:39

I\'m launching the fotorama jquery gallery plug-in from a standard HTML link. It works nicely but I\'d like to launch in full-screen mode right away, rather than having to

相关标签:
2条回答
  • 礼貌的吻别
    2021-01-07 00:49

    I've wasted a lot of time trying to hide Fotorama block. Try to add class “fotorama--hidden”.

    <div class="fotorama fotorama--hidden">
  <!-- images -->
</div>

    This will hide the block but all functions from Art's answer #1 will work normally. And when you exit fullscreen Fotorama will just hide.

    0 讨论(0)
  • 时光取名叫无心
    2021-01-07 00:55

    1. requestFullScreen()

    Use Fotorama API call with prevented auto-initialization:

    <script>
  $(function () {
    var fotorama = $('.fotorama')
      .fotorama({allowfullscreen: true})
      .data('fotorama');

    fotorama.requestFullScreen();
  });
</script>

<div class="fotorama"
     data-auto="false"
     data-height="100%">
  <img src="1.jpg">
  <img src="2.jpg">
</div>

    But there will be a fullscreen-exit icon at the top-right, and users will be able to leave fullscreen. And even if you make the icon invisible, it will possible to close fullscreen by pressing esc button. So...


    2. data-width="100%" data-height="100%"

    I believe that it’s better to imitate fullscreen with this snippet:

    <body style="margin: 0;">

  <div class="fotorama"
       data-width="100%"
       data-height="100%">
    <img src="1.jpg">
    <img src="2.jpg">
    <img src="3.jpg">
  </div>

</body>

    Example: http://fotorama.io/examples/full-window.html.

    0 讨论(0)
 看不清?
提交回复
热议问题