Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.01.2024, 15:05
Новичок на форуме
Отправить личное сообщение для Anatol-karel Посмотреть профиль Найти все сообщения от Anatol-karel
 
Регистрация: 15.01.2024
Сообщений: 5

скрипт адаптивного выпадающего меню
Есть сайт походвкарелию.рф. При изменении ширины экрана(смартфон) скрипт создает форму выпадающего меню. На кнопке появляется "Меню". При клике по ней выпадает сформированные пункты из горизонтального основного меню. При клике на пункте выпавшего меню происходит переход на требуемую страницу. Но при нажатии на стрелку назад в браузере Chrom или Яндекс открывается главная страница (откуда и перешли на другую), но на кнопке не "Меню" , а название страницы, с которой вернулись. Как это убрать? Как обратиться к тексту кнопки, чтобы его поменять?
Скрипт:
$('<form action="#"><select /></form>').appendTo("#mainav");
$("<option />",{selected:"selected",value:"Menu",text:"Мен "}).appendTo("#mainav select");
$("#mainav a").each(function(){var e=$(this);
if($(e).parents("ul ul ul").length>=1){$("<option />",{value:e.attr("href"),text:"- - - "+e.text()}).appendTo("#mainav select")}
else if($(e).parents("ul ul").length>=1){$("<option />",{value:e.attr("href"),text:" - "+e.text()}).appendTo("#mainav select")}
else if($(e).parents("ul").length>=1){$("<option />",{value:e.attr("href"),text:""+e.text()}).append To("#mainav select")}
else{$("<option />",{value:e.attr("href"),text:e.text()}).appendTo( "#mainav select")}});
$("option:first").fadeOut(1000); /* я скрыл пункт "Меню" в выпадающем списке */
$("#mainav select").change(function(){
if($(this).find("option:selected").val()!=="#"){
window.location=$(this).find("option:selected").va l()
}});
Ответить с цитированием
  #2 (permalink)  
Старый 15.01.2024, 18:43
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,728

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
Ответить с цитированием
  #3 (permalink)  
Старый 15.01.2024, 19:20
Новичок на форуме
Отправить личное сообщение для Anatol-karel Посмотреть профиль Найти все сообщения от Anatol-karel
 
Регистрация: 15.01.2024
Сообщений: 5

код все-равно не запустится. Нужны CSS, библиотеки и пр.

$(document).ready(function(){
$('<form action="#"><select /></form>').appendTo("#mainav");
$("<option />",{selected:"selected",value:"Menu",text:"Меню"}).appendTo("#mainav select");
$("#mainav a").each(function(){var e=$(this);
if($(e).parents("ul ul ul").length>=1){$("<option />",{value:e.attr("href"),text:"- - - "+e.text()}).appendTo("#mainav select")}
else if($(e).parents("ul ul").length>=1){$("<option />",{value:e.attr("href"),text:"  - "+e.text()}).appendTo("#mainav select")}
else if($(e).parents("ul").length>=1){$("<option />",{value:e.attr("href"),text:""+e.text()}).appendTo("#mainav select")}
else{$("<option />",{value:e.attr("href"),text:e.text()}).appendTo("#mainav select")}});
/* $("option:first").fadeOut(1000); */   /* я скрыл пункт "Меню" в выпадающем списке */
$("#mainav select").change(function(){
    if($(this).find("option:selected").val()!=="#"){
    window.location=$(this).find("option:selected").val()
}});
$("#mainav form select option").removeAttr('selected');
});

Последний раз редактировалось Anatol-karel, 15.01.2024 в 19:29.
Ответить с цитированием
  #4 (permalink)  
Старый 15.01.2024, 22:30
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,704

Трудно предлагать варианты, не имея возможность попробовать.
Попробуйте строку 3 заменить на
var optmenu = $("<option />",{value:"Menu",text:"Меню"});
optmenu.prop('selected', true);
optmenu.appendTo("#mainav select");

и убрать строку14
Ответить с цитированием
  #5 (permalink)  
Старый 16.01.2024, 09:07
Новичок на форуме
Отправить личное сообщение для Anatol-karel Посмотреть профиль Найти все сообщения от Anatol-karel
 
Регистрация: 15.01.2024
Сообщений: 5

Так вообще не срабатывает. Горизонтальное меню скрывается(это видимо CSS срабатывает), а кнопка не появляется.
Как бы запустить скрипт с нуля при возврате на страницу?
14-й строкой я уже пытался поэкспериментировать.
Откуда вообще может браться текст предыдущей страницы?
Можно как-то селектором выбрать только кнопку?
Как ни пытался, выбирается весь блок <select>.
А... Пардон. Что-то , видно, в первый раз сделал не так. Попробовал снова.
Работает так же, как первоначальный вариант.

Последний раз редактировалось Anatol-karel, 16.01.2024 в 11:35.
Ответить с цитированием
  #6 (permalink)  
Старый 19.01.2024, 13:40
Новичок на форуме
Отправить личное сообщение для Anatol-karel Посмотреть профиль Найти все сообщения от Anatol-karel
 
Регистрация: 15.01.2024
Сообщений: 5

Похоже, надо с начала делать скрипт, скажем, Бургер-меню.
Но опять засада. Чего то я не догоняю.
Полоска <span> возле логотипа рисуется, а :before и :after нет - https://походвкарелию.рф/testindex.html
Ответить с цитированием
  #7 (permalink)  
Старый 19.01.2024, 14:28
Новичок на форуме
Отправить личное сообщение для Anatol-karel Посмотреть профиль Найти все сообщения от Anatol-karel
 
Регистрация: 15.01.2024
Сообщений: 5

это получилось. Иду дальше.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не знаю как написать правильный простой скрипт для меню thrifty (X)HTML/CSS 1 16.12.2017 20:37
Иконка выпадающего меню. LLIypuk jQuery 4 20.09.2017 22:18
Реализация выпадающего меню waterfly Элементы интерфейса 6 05.07.2015 12:40
В IE странная ошибка - скрипт выпадающего меню Akram Internet Explorer 0 11.03.2010 20:37
Скрипт меню работает только под IE7 и выше TAILER Internet Explorer 1 31.08.2009 13:21