Как запретить переход по ссылке
Есть меню вида (см.ниже), необходимо чтобы в десктопной версии были активны все ссылки меню, а в мобильной осуществлялся переход только по самой последней в иерархии т.е. только по Игровые, Трансформеры, Планшеты на Android, Планшеты на Windows
Пожалуйста, подскажите, как такое можно реализовать? (Сделать два меню, одно из которых выводить в десктопной версии, а другое в мобильной не вариант) <ul class="menu-category"> <li class="menu-category-item"><a href="/">Ноутбуки, планшеты</a> <div class="menu-category-content"> <ul> <li><a href="/">Ноутбуки</a> <ul class="menu-category-subcontent"> <li><a href="/">Игровые</a></li> <li><a href="/">Трансформеры</a></li> </ul> </li> <li><a href="/">Планшеты</a> <ul class="menu-category-subcontent"> <li><a href="">Планшеты на Android</a></li> <li><a href="/">Планшеты на Windows</a></li> </ul> </li> </ul> </div> </li> </ul> |
tema1508,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { $(".menu-category").on("click", "a", function(event) { $(window).width() > 768 || $(this).parents(".menu-category-subcontent").length || event.preventDefault() }) }); </script> </head> <body> <ul class="menu-category"> <li class="menu-category-item"><a href="/">Ноутбуки, планшеты</a> <div class="menu-category-content"> <ul> <li><a href="/">Ноутбуки</a> <ul class="menu-category-subcontent"> <li><a href="/">Игровые</a></li> <li><a href="/">Трансформеры</a></li> </ul> </li> <li><a href="/">Планшеты</a> <ul class="menu-category-subcontent"> <li><a href="">Планшеты на Android</a></li> <li><a href="/">Планшеты на Windows</a></li> </ul> </li> </ul> </div> </li> </ul> </body> </html> |
Цитата:
|
// Определяем тип устройства. function is_touch_device() { return (('ontouchstart' in window) || (navigator.MaxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)); } if (!is_touch_device()) { alert("Desctop"); } else alert("Mobile"); Пользуйтесь друзья |
j0hnik,
не получится, проблемы с поддержкой, а моб. устройств туево тучево. |
laimas,
можно дополнить, так чтобы всегда было от чего оттолкнуться и как крайний случай уже разрешение, хотя сейчас ретина в таких же как моник вполне распространена. |
laimas,
Проблемы у каких браузеров? |
Ослик, у сафари есть. Да и то что нет тачпада, есть не показатель настольной системы.
|
laimas, я вам тут подарочек приготовил.
запускать на телефоне ;) <script> var i = 0; (function run(){ navigator.vibrate(i++); setTimeout(run, i*4); })(); </script> |
Цитата:
Я не пользуюсь телефоном и не собираюсь. |
Часовой пояс GMT +3, время: 00:56. |