Кнопка "поделиться" на мобильных устройствах

52
Алексей,
Кнопка "поделиться" на мобильных устройствах

Пример вызова нативного меню мобильного устройства для "расшаривания" страницы сайта.

Работает только если:

  • есть поддержка браузером,
  • у сайта https подключение, 
  • пользователь "кликнул" на кнопку (при загрузке "onload" не сработает)

Пример кода.

<a href="#" style="display:none;" class="blog-share" data-title="Заголовок" data-text="Описание" data-url="https://example.com/">Поделиться</a>
$(document).ready(function() {
	if (navigator.share) { // Проверяем поддержку функционала браузера
		button = $('.blog-share'); // Класс кнопки "поделиться"
		button.show().on('click', function () {
			navigator.share({
				title: $(this).data('title'),
				text: $(this).data('text'),
				url: $(this).data('url'),
			});
			return false;
		});
	} 
});

Попробовать

Если зайдёте на эту страницу с мобильного, то увидите в статье кнопку с примером работы скрипта выше.

Опубликовано 8 Мая 2020 | Обновлено 24 Мая 2020
юзабилити
Похожие статьи
Анимация загрузки. Прелоадер ajax запроса Битрикс. 0
В некоторых интернет-магазинах есть операции которые выполняются достаточно долго. И для того что бы...
Читать дальше »
Алексей,
Получаем адрес посетителя 0
От браузера или по IP с помощью Yandex Map API для автозаполнения в формах
Читать дальше »
Алексей,
Комментарии