Skip to content

Instantly share code, notes, and snippets.

@dustinleer
Last active December 11, 2019 20:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dustinleer/5ff40092ebbf5c083c31c39c3fee9d69 to your computer and use it in GitHub Desktop.
Save dustinleer/5ff40092ebbf5c083c31c39c3fee9d69 to your computer and use it in GitHub Desktop.
Sharethis a11y Functionality jQuery
jQuery(document).ready(function($) {
setTimeout(function(){
//--------------------------
// SHARETHIS a11y
//--------------------------
// Loop through an array of data-network names
['facebook', 'twitter', 'pinterest'].forEach(function( platform ) {
// Adds a11y to sharing icons
$('.st-btn[data-network="' + platform + '"').attr({
'title' : 'social ' + platform.charAt(0).toUpperCase() + platform.slice(1) + '',
'aria-label' : 'Open ' + platform + ' sharing modal',
'tabindex' : '0',
'role' : 'content-info',
});
// Adds enter key functionality to work like a click
$('.st-btn[data-network="' + platform + '"').keypress( function( e ) {
if ( e.which && e.which == 13 ) { // 13 is character code for enter
// event.preventDefault();
$(this).click();
}
});
});
// // Checks to see if container is empty because of browser social blocking
if ($('.sharethis-inline-share-buttons').is(':empty')) {
$('.share').addClass('no-social');
$('.sharethis-inline-share-buttons').append('<div class="no-social">Your browser may be blocking social sharing.</div>');
}
}, 100);
}
@dustinleer
Copy link
Author

This adds tabindex to add focus on tab selection and enter key functionality so it mimics a mouse click to trigger to popup window.

@dustinleer
Copy link
Author

Thanks to @zachfedor for the assist on streamlining this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment