Выпадающее меню по клику для фермы

mobisaite · 24 Ноя 2014

делаю на ферму выпадающее меню столкнулась с одной проблемой в общем по порядку для создания выпадающего меню нужно файлы из архива js.zip залить в папку js далее в ксс прописать

Код:

ul{
    margin: 0;
    padding: 0;
}
li{
    list-style :none;
    text-align: left;
}
a{
    color: #000;
    text-decoration: none;
}
a:hover{
    text-decoration: underline;
}
#main{
    width: 100%;
    height: 620px;
    background: url(../img/font.jpg);
    margin: 0;
}
ul.container{
    width: 240px;
    margin: 0 auto;
    padding: 0;
}
li.menu{
    width: 240px;
    padding: 5px 0;
}

li.button a{
    width: 200px;
    color :#0F7196;
    height: 34px;
    display: block;
    overflow: hidden;
    position: relative;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 21px;
    padding: 10px 20px 0 20px;
}
li.button a:hover{
    text-decoration: none;
}
li.button a span{
    /* This span acts as the right part of the section's background */
    height:44px;
    position:absolute;
    right:0;
    top:0;
    width:4px;
    display:block;
}
li.button a.box1, li.button a.box2, li.button a.box3, li.button a.box4, li.button a.box5, li.button a.box6{
    background: url(../img/point.png);
    color :#0F7196;
    border: solid 1px #0F7196;
}
.dropdown{
    width: 242px;
    display: none;
}
.dropdown li{
    background: url(../img/point.png);
    border: 1px solid #0F7196;
    margin: 5px 0;
    padding: 4px 18px;
}

далее в меню юзера должно выглядеть так

PHP:

<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/script1.js"></script>
<div id="main">
  <ul class="container">
<li class="menu">
<ul>
<li class="button"><a href="#" class="box1">Раздел меню 1</a></li>
                  <li class="dropdown">
                      <ul>
       
<li><a href="ссыль">Название</a></li>
<li><a href="ссыль">Название</a></li>
<li><a href="ссыль">название</a></li>
</ul>
        </li>
          </ul>
      </li>
      <li class="menu">
          <ul>

<li class="button"><a href="#" class="box2">Раздел 2</a></li>
                  <li class="dropdown">
                      <ul>
<li><a href="ссыль">Название</a></li>
<li><a href="ссыль">Название</a></li>
</ul>
        </li>
          </ul>
</div>

Все работает сворачивается и разворачивается итд только одно но к примеру когда переходишь на страницу 3-го уровня вложенности все перестает работать ни сворачивается ни разворачивается, Помогите с решением как я понимаю нужно что то прописать в .htaccess но не могу понять что(((

mobisaite · 24 Ноя 2014

Я может как то не так что написала или ни кто не знает? вот к примеру сайт/account тут норм меню работает а сайт/account/swap при нажатии на раздел для раскрытия меню ссыль в адресной строке стает сайт/account/swap# и меню не открывается что прописать в хтацесе чтобы все ок было?

kvozimir · 24 Ноя 2014

mobisaite написал(а):
Я может как то не так что написала или ни кто не знает? вот к примеру сайт/account тут норм меню работает а сайт/account/swap при нажатии на раздел для раскрытия меню ссыль в адресной строке стает сайт/account/swap# и меню не открывается что прописать в хтацесе чтобы все ок было?

думаюу нас с ксс мало дружат)

mobisaite · 24 Ноя 2014

kvozimir написал(а):
думаюу нас с ксс мало дружат)

да тут дело не в ксс дело в .htaccess нужно что бы обрабатывалась # которая добавляется при нажатии на раздел все же что в папке account без него не робит

kvozimir · 24 Ноя 2014

mobisaite написал(а):
да тут дело не в ксс дело в .htaccess нужно что бы обрабатывалась # которая добавляется при нажатии на раздел все же что в папке account без него не робит

я конечно в этом не очень разбираюсь но при чем тут #

wh1skas · 24 Ноя 2014

.htaccess тут не при чем )) Необходимо сравнить,какой класс привязан к кнопке, которая разворачивает одно меню, и проверь какой класс прописан в другом меню.

Есть такой вариант, что кнопка твоя не раскрывается ввиду того, что там присвоена ссылка <a href="">. В этом случае надо использовать другой класс. Ведь кнопки, которые раскрываются просто обрамлены дивами и ссылки там нет?

mobisaite · 24 Ноя 2014

wh1skas написал(а):
.htaccess тут не при чем )) Необходимо сравнить,какой класс привязан к кнопке, которая разворачивает одно меню, и проверь какой класс прописан в другом меню.

Есть такой вариант, что кнопка твоя не раскрывается ввиду того, что там присвоена ссылка <a href="">. В этом случае надо использовать другой класс. Ведь кнопки, которые раскрываются просто обрамлены дивами и ссылки там нет?

да ссылка присвоена <a href="#"> в общем я в 1-м посте все это выложила я вообще этот код нашла на просторах инета и немного переделала так как уже давно бьюсь с этим меню на ксс и джаве так и не могу догнать как его все же сделать а на чистом ксс мне не нравится

wh1skas · 24 Ноя 2014

Я тебе бы посоветовал найти спойлер на jQuerry с плавным открытием. Я сам такой нарыл, доволен ))

mobisaite · 24 Ноя 2014

wh1skas написал(а):
Я тебе бы посоветовал найти спойлер на jQuerry с плавным открытием. Я сам такой нарыл, доволен ))

где же ты раньше то был я уже с месяца полтора воюю с этим а решение то простое

wh1skas · 24 Ноя 2014

mobisaite написал(а):
где же ты раньше то был я уже с месяца полтора воюю с этим а решение то простое

)))) А ты и не спрашивала меня )))))

vogman · 15 Дек 2014

Было бы вообще не плохо если б кто то выложил поистенне рабочий спойлер в модули думаю многие бы хотели поставить себе плавающее меню

kvozimir · 15 Дек 2014

норм рабочее,умеющий человек под себя поправит

vogman · 15 Дек 2014

kvozimir написал(а):
норм рабочее,умеющий человек под себя поправит

не ну я имел в модули это отправить под тему , ну все равно спасибо)

kvozimir · 15 Дек 2014

vogman написал(а):
не ну я имел в модули это отправить под тему , ну все равно спасибо)

тема в нужном разделе,в норм названием)я так думаю)

vogman · 15 Дек 2014

kvozimir написал(а):
тема в нужном разделе,в норм названием)я так думаю)

Разве эти строчки не в css должны быть?

Код:

#accordion {
    list-style: none;
    padding:0 0 0 0;
    margin:-10px 0px 11px 3px;
    width: 300px;
}
#accordion li{
    background: url(/img/field-gr.jpg) no-repeat;
    width:220px;
    height:31px;
    padding:9px 0px 0px 48px;
    margin:-10px 0px 11px 25px;
}


#accordion ul {

    list-style: none;
    padding: 0 0 0 0;
        margin:-19px 0px 0px -3px;
    display: none;
}
#accordion ul li{
    font-weight: normal;
    box-shadow: inset 0px 1px 10px 1px rgba(5, 5, 5, 0.900), 3px 5px 10px rgba(0, 0, 0, 0.302);
    cursor: auto;
    background-color: #0bda51;
    padding: 5 0 5 20px;
}
.#accordion a {
    text-decoration: none;
}
.#accordion a:hover {
    text-decoration: underline;
}

и еще один вопрос как мне прикрутить картинку к категории

kvozimir · 15 Дек 2014

vogman написал(а):

Разве эти строчки не в css должны быть?

Код:

#accordion {
    list-style: none;
    padding:0 0 0 0;
    margin:-10px 0px 11px 3px;
    width: 300px;
}
#accordion li{
    background: url(/img/field-gr.jpg) no-repeat;
    width:220px;
    height:31px;
    padding:9px 0px 0px 48px;
    margin:-10px 0px 11px 25px;
}


#accordion ul {

    list-style: none;
    padding: 0 0 0 0;
        margin:-19px 0px 0px -3px;
    display: none;
}
#accordion ul li{
    font-weight: normal;
    box-shadow: inset 0px 1px 10px 1px rgba(5, 5, 5, 0.900), 3px 5px 10px rgba(0, 0, 0, 0.302);
    cursor: auto;
    background-color: #0bda51;
    padding: 5 0 5 20px;
}
.#accordion a {
    text-decoration: none;
}
.#accordion a:hover {
    text-decoration: underline;
}

и еще один вопрос как мне прикрутить картинку к категории

А разница?!работает ведь так)

Выпадающее меню по клику для фермы

Вложения

Вложения