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

matthewk

Member
  • Posts

    9
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hi Creedon. Do you know what the code or class name is for this icon? so I can use that instead of ? Thanks~
  2. Another question but about the slideshow reel. Is there a way to make the images clickable to then show the full size of that image? Thanks~
  3. Has anyone been able to figure this one out? Thanks
  4. That worked! Thank you. For anyone else that wants the minimalist buttons and for the reel to scroll, this is what I used: <script> $( ( ) => { // returns svg element buttonSvg = ( direction, points ) => { let $e = $( '<svg class="caret-' + direction + '-icon--small" viewBox="0 0 9 16">' + '<polyline fill="none" stroke-miterlimit="10" points="' + points + ' ">' + '</polyline>' + '</svg>' ); return $e; } // simple class changer simpleClassChanger = ( old, nw ) => { $( '.' + old ) .removeClass ( old ) .addClass ( nw ); } simpleClassChanger ( 'gallery-reel-controls', 'gallery-slideshow-controls' ); // start previous button $( '.gallery-reel-control:nth-of-type( odd )' ) .removeClass ( 'gallery-reel-control' ) .addClass ( 'gallery-slideshow-control gallery-slideshow-control-prev' ) .each ( function ( ) { $( 'svg', $( this ) ).replaceWith ( buttonSvg ( 'left', '7.3,14.7 2.5,8 7.3,1.2' ) ); } ); // end previous button // start next button $( '.gallery-reel-control:nth-of-type( even )' ) .removeClass ( 'gallery-reel-control' ) .addClass ( 'gallery-slideshow-control gallery-slideshow-control-prev' ) .each ( function ( ) { $( 'svg', $( this ) ).replaceWith ( buttonSvg ( 'right', '1.6,1.2 6.5,7.9 1.6,14.7' ) ); } ); // end next button simpleClassChanger ( 'gallery-reel-control-btn', 'gallery-slideshow-control-btn' ); simpleClassChanger ( 'gallery-reel-control-btn-icon', 'gallery-slideshow-control-btn-icon' ); } ); $(function(){ window.setInterval(function(){ {$("html:not(.sqs-modal-lightbox-open) body:not(.sqs-edit-mode-active, .sqs-edit-mode) .gallery-slideshow-control:nth-of-type(2) .gallery-slideshow-control-btn") [0].click()} }, 2000); }); </script>
  5. Hi Creedon and all. I want to use the code above for the custom arrows but I already have some code that makes the slideshow reel autoscroll. When I add this code below that, the arrows are there but the autoscroll stops. Any help would be so appreciated. Thanks! This is the code for the auto scroll. The first part goes into the Page Header Advanced Settings and then the second part goes into the custom CSS <script src="https://code.jquery.com/jquery-3.5.1.js"></script> <script> $(function(){ window.setInterval(function(){ {$("html:not(.sqs-modal-lightbox-open) body:not(.sqs-edit-mode-active, .sqs-edit-mode) .gallery-reel-control:nth-of-type(2) .gallery-reel-control-btn") [0].click()} }, 2000); }); </script> CSS [data-section-id='YOUR DATA SECTION ID']{ .gallery-reel{ height:20vh !important; padding-left: 0px; padding-right: 0px; figure{ filter:grayscale(100%); } .gallery-reel-controls{ display:none; } } }
×
×
  • Create New...