Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Caue

Member
  • Posts

    90
  • Joined

  • Last visited

  • Days Won

    1

Community Answers

  1. Caue's post in Button that pops-up a video lightbox was marked as the answer   
    Out of so many possible ways to do it, this is how I've done it:
    http://www.cregox.com/full-video/
    There are quite many steps and options there. Here I'll write the most simplified version, with very basic steps which might not be so easy to follow but should be enough if you know how to find your way:
    First,
    .Then, create a link anywhere you want with this updated to your video ID:
    javascript:jqueryLightbox('RpLBR38kVvY');
    Then, add the following script somewhere:
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script name="full video lightbox" author="cregox.com"> // to use it, create a gallery block, make it a grid and check the Lightbox. // now add an item to it, either with the plus button or from another gallery. // finally add a link to any block you want, // calling jqueryLightbox function with a video url string. // for instance, to a vimeo video: // javascript:jqueryLightbox('video/127121696'); // // for more info, visit www.cregox.com/full-video $(document).ready(function(){ $('a[href^="javascript:jqueryLightbox("]').each(function(){ var $videoButton = $(this); var videoString = $videoButton.attr('href').split("('")[1].split("')")[0]; var $galleryLightbox = $('div[data-html*="'+ videoString +'"]'); $galleryLightbox.parents('.sqs-block-gallery').hide(); // this is the line not being used in this page var $galleryLightboxImg = $galleryLightbox.find('img'); $videoButton.click(function(){ $galleryLightboxImg.hide(); // as to not show them before loading video $galleryLightboxImg.click(); }); $videoButton.attr('href', 'javascript:'); $videoButton.addClass('lightboxed'); }); }); function jqueryLightbox (videoString) { alert('jQuery not loaded'); } </script>
×
×
  • Create New...