Перейти к содержанию
Авторизация  
TToriginal

HTML Меню отдельно

Рекомендуемые сообщения

Здравствуйте, уважаемые господа !

Появилась идея создать информационный портал на html и сразу возникла проблема: 

В дальнейшем хотел бы добавлять категории в меню постепенно, не все сразу, но при большом количестве страниц, это займет много времени, редактировать каждую страницу и не удобно это все будет делать.

Создал новый файл menu.html

Разместил туда меню

В каждой странице прописал код :

<div id="menu"></div>
<script type="text/javascript"> $(function(){ $('#menu').load('menu.html'); }); </script>

Но не работает, возможно я не туда пошел?

 

Возможно какой-то выход? Поместить меню в один файл html и прикрепить его ко всем страницам, чтобы редактировать только его?

Изменено пользователем JoeyTribbiani

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
30 минут назад, TTOriginal сказал:

Здравствуйте, уважаемые господа !

Появилась идея создать информационный портал на html и сразу возникла проблема: 

В дальнейшем хотел бы добавлять категории в меню постепенно, не все сразу, но при большом количестве страниц, это займет много времени, редактировать каждую страницу и не удобно это все будет делать.

Возможно какой-то выход? Поместить меню в один файл html и прикрепить его ко всем страницам, чтобы редактировать только его?

Создал menu.js

Прописал код :

$(function() {
    $('#loadContent').load('menu.html');
});

Подключил к страницам кодом:

<script src="menu.js" type="text/javascript" ></script>

Опять что-то не туда :blink:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Через  iframe :

<iframe src="menu.html" seamless></iframe>

Просто ставит его сверху, сунул материал вниз

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

При использовании jQuery:

<script> 
    $(function(){
      $("#includedContent").load("menu.html"); 
    });
    </script> 
<div id="includedContent"></div>

также ничего

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тебе без использования PHP?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
4 минуты назад, zGosu сказал:

Тебе без использования PHP?

да)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
<script>
$(document).ready(function() {
    $("#includedContent").load("menu.html"); 
}); 
</script>

 

Изменено пользователем thetro
  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
6 минут назад, thetro сказал:

<script>
$(document).ready(function() {
    $("#includedContent").load("menu.html"); 
}); 
</script>

 

Добавил перед </head>

<script>
$(document).ready(function() {
    $("#includedContent").load("menu.html"); 
}); 
</script>

Добавил в <body>

<div id="includedContent"></div>

Но к сожалению не работает

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

На хостинг/open server залить нужно. Ajax не будет работать если просто открываешь html файл в браузере.

И jquery подключен?

Изменено пользователем thetro
  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
25 минут назад, thetro сказал:

На хостинг/open server залить нужно. Ajax не будет работать если просто открываешь html файл в браузере

работает

Изменено пользователем TTOriginal
ошибка

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Как вариант:

<div id="menu"></div>
$(function(){
$("#menu").prepend('<ul><li><a href="#">Пункт 1</a></li><li><a href="#">Пункт 2</a></li><li><a href="#">Пункт 3</a></li></ul>');
});

Рабочий пример: https://jsfiddle.net/l2banners/v1f8sde6/

Изменено пользователем L2Banners
  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
3 часа назад, L2Banners сказал:

Как вариант:


<div id="menu"></div>

$(function(){
$("#menu").prepend('<ul><li><a href="#">Пункт 1</a></li><li><a href="#">Пункт 2</a></li><li><a href="#">Пункт 3</a></li></ul>');
});

Рабочий пример: https://jsfiddle.net/l2banners/v1f8sde6/

Спасибо ^_^

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти
Авторизация  

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×
×
  • Создать...