Zend certified PHP/Magento developer

Magento 2 open fullscreen/lightbox view when clicking on product thumbnails

I’m attempting to make it so that if I click on one of the thumbnails in the carousel it opens the fullscreen mode rather than the customer having to click twice to first get the image onto the stage/previewed image.

I tried using the demo at http://artpolikarpov.github.io/fotorama/test/lightbox.html

I modified the code to run on my site like this:

$('[data-gallery-role="nav-frame"]').each(function () {
      var $thumbs = jQuery(this);
      var fotorama = jQuery("[data-gallery-role='gallery']").data('fotorama');

      // bind clicks
      $thumbs.on('click', 'a', function (e) {
        e.preventDefault();

        var $this = $(this);

        fotorama.show({index: $this.attr('href'), time: 0}).requestFullScreen();
      });

      jQuery("[data-gallery-role='gallery']").on('fotorama:fullscreenexit', function () {
        jQuery("[data-gallery-role='gallery']").stop().fadeTo(0, 0);
      });
    });

Unfortunately, it still requires you to first click the thumbnail, then click on the larger preview window.