Hi Kriesi,
I’m using the Image with hotspots element and I’d like to add anchor links to my hotspots so they could open the contents of the tabs section (both in the same page).
I tried adding this script to the function.php but it doesn’t work: the browser doesn’t scroll to the tab content (but if I scroll manually the right tab is open).
Could you please help me to fix it?
Thanks in advance!
Hey sunstudio,
Thank you for using Enfold.
We would like to check the hotspot image and the tab section setup. Please provide a link to the actual page. The script from the other thread is specifically created for the main menu items in the header.
Best regards,
Ismael
Hi Ismael,
check here below, please.
Hi,
Thank you for the info.
Use this code instead.
// custom script
add_action( 'wp_footer', 'ava_custom_script_tab_section' );
function ava_custom_script_tab_section() {
?>
<script type="text/javascript">
(function($) {
function scrollToTab(s, e,) {
$(s).on(e, function(event) {
var anchor, loc, cur, hash, tab, parent, pos;
if( e == 'load' ) {
loc = window.location.hash;
hash = loc;
} else {
loc = $(this).attr('href');
hash = loc.substring(loc.indexOf('#'));
}
tab = $('.av-section-tab-title[href='+ hash +']');
parent = tab.parents('.av-tab-section-outer-container');
pos = parent.offset();
tab.trigger('click');
if(hash) {
setTimeout( function() {
$(window).scrollTop( pos.top - 100 )
}, 300 );
}
});
}
scrollToTab( '.av-image-hotspot_inner', 'click' );
})(jQuery);
</script>
<?php
}
Best regards,
Ismael
Thanks Ismael!