Создать ответ 
Скрипт раздвижного меню
Автор Сообщение
artara-nn Не на форуме
Старший сержант
*

Сообщений: 48
У нас с: Sep 2014
Сообщение: #21
RE: Скрипт раздвижного меню
Приветствую) подскажите пожалуйста, поставил скрипт себе на сайт, сворачивается разворачивается все нормально, но отображается неправильно, как исправить?

Забыл скрин прикрепить.

[Изображение: collapsing_menu.jpg]
(Последний раз сообщение было отредактировано 28.09.2014 в 13:16:39, отредактировал пользователь artara-nn.)
28.09.2014 13:13:56
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #22
RE: Скрипт раздвижного меню
Так у Вас CSS оформление либо отсутствует, либо прописано не верно. Дайте лучше в личку ссылку на страничку со скриптом, я посмотрю исходный код, и тогда точно смогу что-то подсказать.

P.S. Уже по Вашей почте сам нашел сайт. Al
Как итог - Вы не добавили CSS оформление для данного меню.
28.09.2014 13:33:12
Найти все сообщения Цитировать это сообщение
artara-nn Не на форуме
Старший сержант
*

Сообщений: 48
У нас с: Sep 2014
Сообщение: #23
RE: Скрипт раздвижного меню
(28.09.2014 13:33:12)Admin писал(а):  Так у Вас CSS оформление либо отсутствует, либо прописано не верно. Дайте лучше в личку ссылку на страничку со скриптом, я посмотрю исходный код, и тогда точно смогу что-то подсказать.

P.S. Уже по Вашей почте сам нашел сайт. Al
Как итог - Вы не добавили CSS оформление для данного меню.

Спасибо, нашел ошибку, исправил))
28.09.2014 14:06:25
Найти все сообщения Цитировать это сообщение
vladdddq Не на форуме
Рядовой
*

Сообщений: 7
У нас с: Nov 2014
Сообщение: #24
RE: Скрипт раздвижного меню
Подскажите, как сделать так, чтобы при переходе на страницу один из пунктов меню уже был развернут?
06.12.2014 11:33:37
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #25
RE: Скрипт раздвижного меню
Если должен быть развернут всегда один и тот же пункт меню, то присвойте данному пункту уникальный id, например, "open_ul":
Код:
<li><span>Онлайн-сервисы</span>
    <ul id="open_ul">
        <li><a href="csscompressor.php">Сжатие CSS кода онлайн</a></li>
        <li><a href="javascriptcompressor.php">Сжатие JavaScript кода</a></li>
        <li><a href="opennet.php">Калькулятор диапазонов IP</a></li>
        <li><a href="qrcoder.php">Онлайн генератор QR кодов</a></li>
        <li><a href="gtmetrix.php">Анализ скорости сайта</a></li>
    </ul>
</li>

А в JavaScript коде замените $("#menu ul").hide();, на $("#menu ul[id!='open_ul']").hide();
06.12.2014 14:36:31
Найти все сообщения Цитировать это сообщение
vladdddq Не на форуме
Рядовой
*

Сообщений: 7
У нас с: Nov 2014
Сообщение: #26
RE: Скрипт раздвижного меню
Спасибо, подскажите еще, пожалуйста, при наведении мышкой на <li> они меняю цвет, как сделать так, чтобы при нажатии на пункт меню он вы делился тем же цветом, что и при наведении (и при переходе на страницу, так же был выделен на новой странице).
А при нажатии на другой <li>, новый выделился, а старый окрасился в цвет остального списка?
22.01.2015 14:05:47
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #27
RE: Скрипт раздвижного меню
Если я понял задачу правильно, то тогда добавьте все пунктам меню <li> уникальные идентификаторы (например, <li id="101">).

Добавьте CSS код:
Код:
.activ_li {
  background: #AAAAAA !important;
  border-left: 5px #000000 solid !important;
  padding-left: 15px !important;
}

И следующий JavaScript код:
Код:
if ($.cookie('activ_li')>0) { $('#menu li ul li[id='+$.cookie('activ_li')+'] a').addClass("activ_li"); }
$('#menu li ul li').click(function() { $.cookie('activ_li',$(this).attr("id")); });
22.01.2015 22:12:42
Найти все сообщения Цитировать это сообщение
ubivik Не на форуме
Рядовой
*

Сообщений: 1
У нас с: Feb 2015
Сообщение: #28
RE: Скрипт раздвижного меню
(16.01.2014 19:44:39)Admin писал(а):  Вроде получилось. Работать корректно будет только в том случае, когда одновременно открыт только один пункт меню.

Итак, для начала нам понадобится какой-нибудь php файл, например 1.php (если название будет другое, то не забудьте изменить его и в функции jQuery.post). В него помещаем вот такой код:
PHP код:
<?php
if (session_id()==''session_start();
if (isset(
$_POST["menu_id"])) $_SESSION["menu_id"]=$_POST["menu_id"];
?>

Весь остальной код (тот, который будет на каждой страничке или в шаблоне):
PHP код:
<?php if (session_id()==''session_start(); ?>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<style type="text/css">
ul#menu, ul#menu ul {
  list-style-type:none;
  margin: 0px;
  padding: 0px;
  width: 250px;
}

ul#menu a,ul#menu span { display: block; text-decoration: none; }

ul#menu li { margin-top: 1px; }

ul#menu li a,ul#menu li span {
  background: #333333;
  color: #FFFFFF;
  padding: 7px;
}

ul#menu li a:hover,ul#menu li span:hover { background: #000000; }

ul#menu li ul li a {
  background: #CCCCCC;
  color: #000000;
  padding-left: 20px;
}

ul#menu li ul li a:hover {
  background: #AAAAAA;
  border-left: 5px #000000 solid;
  padding-left: 15px;
}
</style>


<ul id="menu">
 <li><span>Скрипты</span>
    <ul id="1">
     <li><a href="log_info.php">Скрипт записи логов</a></li>
     <li><a href="current_time.php">Текущая дата и время</a></li>
     <li><a href="slide_show_jquery.php">Слайд-шоу на jQuery</a></li>
     <li><a href="scroll_to_top.php">Кнопка вверх</a></li>
    </ul>
 </li>
 <li><span>Онлайн-сервисы</span>
    <ul id="2">
        <li><a href="csscompressor.php">Сжатие CSS кода онлайн</a></li>
        <li><a href="javascriptcompressor.php">Сжатие JavaScript кода</a></li>
        <li><a href="opennet.php">Калькулятор диапазонов IP</a></li>
        <li><a href="qrcoder.php">Онлайн генератор QR кодов</a></li>
        <li><a href="gtmetrix.php">Анализ скорости сайта</a></li>
    </ul>
 </li>
 <li><a href="http://usefulscript.ru/support.php">Поддержка</a></li>
 <li><a href="http://usefulscript.ru/forum/">Форум</a></li>
 <li><span>Хитрости</span>
    <ul id="3">
        <li><a href="csssprites.php">Использование CSS спрайтов</a></li>
        <li><a href="rgb_cod_color.php">HEX и RGB коды цветов</a></li>
        <li><a href="no_www.php">Убрать www из адреса сайта</a></li>
    </ul>
 </li>
</ul>


<script type="text/javascript">
function init_menu() {
<?php
 
if (isset($_SESSION["menu_id"])) echo "$('#menu ul[id!=\"".$_SESSION["menu_id"]."\"]').hide();";
 else echo 
"$('#menu ul').hide();"
?>
$('#menu li span').click(
 function() {
    var checkElement=$(this).next();
    jQuery.post("1.php",{menu_id:$(this).next().attr("id")});
    if((checkElement.is('ul')) && (checkElement.is(':visible'))) { return false; }
    if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
        $('#menu ul:visible').slideUp('normal');
        checkElement.slideDown('normal');
        return false;
    }
 }
);
}
$(document).ready(function() {init_menu();});
</script> 

Как видно из приведенного кода, изменения минимальны: первой строчкой добавилось <?php if (session_id()=='') session_start(); ?>
Если сессии на Вашей страничке уже стартовали ранее, то данную строчку можно удалить.

Далее, каждому элементу ul мы присваиваем уникальный id (например, <ul id="1"> и т.д.).

Ну и в конце небольшие изменения коснулись функции init_menu().

Что-то все сделал, а меню все равно сворачивается. Может php не туда загрузил, куда его надо?
(Последний раз сообщение было отредактировано 11.02.2015 в 11:59:13, отредактировал пользователь ubivik.)
11.02.2015 11:56:07
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,431
У нас с: Aug 2011
Сообщение: #29
RE: Скрипт раздвижного меню
Только что проверял, все работает.

Еще раз повторю, что для начала нам понадобится PHP файл (например, 1.php). В него мы помещаем первый код (тот, который маленький). А меню (большой код) уже можно размещать в любой другой PHP файл.

Возможно, Ваш сервер не работает с сессиями на PHP, в которых мы и храним идентификатор открытого пункта меню.
11.02.2015 20:16:01
Найти все сообщения Цитировать это сообщение
vladdddq Не на форуме
Рядовой
*

Сообщений: 7
У нас с: Nov 2014
Сообщение: #30
RE: Скрипт раздвижного меню
(22.01.2015 22:12:42)Admin писал(а):  Если я понял задачу правильно, то тогда добавьте все пунктам меню <li> уникальные идентификаторы (например, <li id="101">).

Добавьте CSS код:
Код:
.activ_li {
  background: #AAAAAA !important;
  border-left: 5px #000000 solid !important;
  padding-left: 15px !important;
}

И следующий JavaScript код:
Код:
if ($.cookie('activ_li')>0) { $('#menu li ul li[id='+$.cookie('activ_li')+'] a').addClass("activ_li"); }
$('#menu li ul li').click(function() { $.cookie('activ_li',$(this).attr("id")); });

Что-то не получается.
Дал всем пунктам меню id.
Стили поставил.

Может проблема в том что путь к меню со всех страниц <?php require_once("../../parts/ddd_cafe/ddd_cafe_menu.php") ;?> выглядит вот так?
14.02.2015 14:23:29
Найти все сообщения Цитировать это сообщение
Создать ответ 


Переход:


Пользователи просматривают эту тему: 1 Гость(ей)


LiveInternet
© Copyright 2011-2024 by UsefulScript.ru