Tagged: Lightbox
-
AuthorPosts
-
April 1, 2020 at 12:45 pm #1199722
Hallo there!
Is it possible to open a lightbox from an anchor link?
I checked the answers here, but could’t fid the right one.When clicking on the first button on the page (see private infos) I want to get to the slider one section after the image rows and I want that the slider-lightbox is open!
April 5, 2020 at 3:58 am #1200895Hey NorthcoastProject,
Sorry for the late reply, thanks for the login but it didn’t work for me, please check. Unfortunately, you can not open a lightbox with an anchor link, but this script will trigger your slideshow lightbox when it scrolls into view, which can be done with the anchor link, so when you click the anchor link and scroll to the ID the lightbox is triggered. I had to add a 500ms delay because the lightbox opened too quickly and was positioned too high on the page, so it was not in view.
Try adding this code to the end of your functions.php file in Appearance > Editor:function custom_script(){ ?> <script> function isOnScreen(elem) { if( elem.length == 0 ) { return; } var $window = jQuery(window) var viewport_top = $window.scrollTop() var viewport_height = $window.height() var viewport_bottom = viewport_top + viewport_height var $elem = jQuery(elem) var top = $elem.offset().top var height = $elem.height() var bottom = top + height return (top >= viewport_top && top < viewport_bottom) || (bottom > viewport_top && bottom <= viewport_bottom) || (height > viewport_height && top <= viewport_top && bottom >= viewport_bottom) } jQuery( document ).ready( function() { window.addEventListener('scroll', function(e) { if( isOnScreen( jQuery( '#slideshow-adventurer' ) ) ) { setTimeout(function () { jQuery('#slideshow-adventurer a').trigger('click'); }, 500); } }); }); </script> <?php } add_action('wp_footer', 'custom_script');
Best regards,
MikeApril 10, 2020 at 12:42 pm #1202649This reply has been marked as private.April 10, 2020 at 1:18 pm #1202657This reply has been marked as private.April 11, 2020 at 9:26 pm #1202990Hi,
Sorry, the first one is not possible, for the second one, you can’t have one button do two actions at the same time.Best regards,
MikeApril 14, 2020 at 10:55 am #1203516Hey Mike.
okay, but I just want that the button on click opens the first image of the lightbox. This isn’t possible either?
Best regards,
KaApril 14, 2020 at 12:30 pm #1203540Hi,
I was able to make clicking on the “Bildergalerie” button open the lightbox after waiting 500ms, which seems to be just the right amount of time for the page scroll down to the section. I added a custom ID to your button so only this button triggers the action.
I added this function to your child theme functions.php:function custom_adventure_script(){ ?> <script> (function($){ $(window).load(function() { $('#adventure a.avia-button.avia-icon_select-yes-left-icon').click(function(e){ e.preventDefault(); setTimeout(function(){ window.location.href = "https://your-url/#slideshow-adventurer"; $('#slideshow-adventurer a').trigger('click'); setTimeout(function(){ $('button.mfp-arrow.mfp-arrow-right.mfp-prevent-close').trigger('click'); }, 200); }, 500); }); }); })(jQuery); </script> <?php } add_action('wp_footer', 'custom_adventure_script');
One issue I had was the slideshow always opened the last slide in the lightbox, so I added a second click on a delay to show the first image “Start your Adventure”
Please clear your browser cache and check.Best regards,
MikeApril 16, 2020 at 12:29 pm #1204394This is superbe!!!!! Thank you.
April 16, 2020 at 9:00 pm #1204542Hi,
Did you need additional help with this topic or shall we close?
Best regards,
Jordan ShannonApril 16, 2020 at 10:38 pm #1204567This is one of those topics I particularly hate.
Someone ( in this case Mike ) is trying hard to find a solution and nobody knows what for; if it could be useful for you – or me.
Is it really so difficult to have a page on which one shows an example of what is meant.
Is it really always necessary to hold the page in question secret?I checked the answers here, but could’t fid the right one.
Where do you check ( no link ) etc. pp.
April 16, 2020 at 11:12 pm #1204573Hey Guenter,
@NorthCoast, are you okay with us making the answer public in an attempt to help other users who are having the same issue?
Best regards,
Jordan ShannonApril 17, 2020 at 10:02 am #1204671This reply has been marked as private.April 17, 2020 at 10:06 am #1204674You can close it, thanks a lot for your help!
April 18, 2020 at 11:13 am #1204884Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)Best regards,
Mike -
AuthorPosts
- The topic ‘open lightbox from an anchor link’ is closed to new replies.