Здравствуйте уважаемые формучане!
Подскажите пожалуйста, как можно сделать примерно такое же как и на этой странице? http://www.cs-cart.ru/vopros-otvet.html
То есть при нажатии на текст, открывается описание и так же убирается. Нужно ли для этого устанавливать какой-то дополнитеьный мод или это легко делается самостоятельно?
Помню, что когда-то для Joomla были модули FAQ, с помощью который можно было это сделать легко на одной странице
Ну как вариант http://www.cs-cart.ru/docs/4.2.x/developer/instruments/templates/toggle.html
Вообще были модули в шопе
Спасибо всем за помощь
На всякий случай решил спросить правильно ли я всё делаю и возможно ли эту упростить?
В общем задача такая:
есть страница, на которой перечислены области (пр. Московская область, Ленинградская область и т.д.), при нажатии на область, появляются города, при нажатии на нужный город появляется список сервисных центров, а при нажатии на него появляется какой-то текст (контакты и т.д.)
Вот код на странице:
Алтайский крайБарнаул
- Барнаул Газ-Сервис, ООО
Текст текст текст текст текст текст
- Барнаулгоргаз, ООО
Текст текст текст текст текст текст
- Магазин отопительного оборудования "Котел" (ТриоЦентр, ООО)
Текст текст текст текст текст текст
- Газпром газораспределение Барнаул, АО
Текст текст текст текст текст текст
- Акватория (Аквастрой, ООО)
Текст текст текст текст текст текст
- Dюйм (Стройинжиниринг, ООО)
Текст текст текст текст текст текст
- ПрофМонтажСервис, ООО
Текст текст текст текст текст текст
а вот css:
#svernut ol {
margin: 0;
}
#svernut li {
margin-left: 14%;
padding-left: 6px;
font-size: 11pt;
font-weight: bold;
}
#sw_svernut {
font-size: 17pt;
margin-left: 6%;
color: #293d4f;
border-width: 0px 0px 1px 0px;
border-style: dashed;
}
#sw_svernut:hover {
color: #468fd2;
border-style: none;
}
#svernut p {
font-size: 11pt;
margin-left: 2%;
color: #293d4f;
}
#sw_svernut2 {
font-size: 14pt;
margin-left: 12%;
color: #fe8900;
border-width: 0px 0px 1px 0px;
border-style: dashed;
}
#sw_svernut2:hover {
color: #468fd2;
border-style: none;
}
#svernut2 p {
font-size: 11pt;
margin-left: 2%;
color: #293d4f;
}
#sw_svernut3, #sw_svernut4, #sw_svernut5, #sw_svernut6, #sw_svernut7, #sw_svernut8, #sw_svernut9, #sw_svernut10, #sw_svernut11, #sw_svernut12, #sw_svernut13, #sw_svernut14, #sw_svernut15, #sw_svernut16, #sw_svernut17, #sw_svernut18, #sw_svernut19, #sw_svernut20, #sw_svernut21, #sw_svernut22, #sw_svernut23, #sw_svernut24, #sw_svernut25, #sw_svernut26, #sw_svernut27, #sw_svernut28, #sw_svernut29, #sw_svernut30, #sw_svernut31, #sw_svernut32, #sw_svernut33, #sw_svernut34, #sw_svernut35, #sw_svernut36, #sw_svernut37, #sw_svernut38, #sw_svernut39, #sw_svernut40, #sw_svernut41, #sw_svernut42, #sw_svernut43, #sw_svernut44, #sw_svernut45, #sw_svernut46, #sw_svernut47, #sw_svernut48, #sw_svernut49, #sw_svernut50 {
font-size: 13pt;
/*margin-left: 14%;*/
color: #2166ba;
border-width: 0px 0px 1px 0px;
border-style: dashed;
}
#sw_svernut3:hover, #sw_svernut4:hover, #sw_svernut5:hover, #sw_svernut6:hover, #sw_svernut7:hover, #sw_svernut8:hover, #sw_svernut9:hover, #sw_svernut10:hover, #sw_svernut11:hover, #sw_svernut12:hover, #sw_svernut13:hover, #sw_svernut14:hover, #sw_svernut15:hover, #sw_svernut16:hover, #sw_svernut17:hover, #sw_svernut18:hover, #sw_svernut19:hover, #sw_svernut20:hover, #sw_svernut21:hover, #sw_svernut22:hover, #sw_svernut23:hover, #sw_svernut24:hover, #sw_svernut25:hover, #sw_svernut26:hover, #sw_svernut27:hover, #sw_svernut28:hover, #sw_svernut29:hover, #sw_svernut30:hover, #sw_svernut31:hover, #sw_svernut32:hover, #sw_svernut33:hover, #sw_svernut34:hover, #sw_svernut35:hover, #sw_svernut36:hover, #sw_svernut37:hover, #sw_svernut38:hover, #sw_svernut39:hover, #sw_svernut40:hover, #sw_svernut41:hover, #sw_svernut42:hover, #sw_svernut43:hover, #sw_svernut44:hover, #sw_svernut45:hover, #sw_svernut46:hover, #sw_svernut47:hover, #sw_svernut48:hover, #sw_svernut49:hover, #sw_svernut50:hover {
color: #468fd2;
border-style: none;
}
#sw_svernut3 p, #sw_svernut4 p, #sw_svernut5 p, #sw_svernut6 p, #sw_svernut7 p, #sw_svernut8 p, #sw_svernut9 p, #sw_svernut10 p, #sw_svernut11 p, #sw_svernut12 p, #sw_svernut13 p, #sw_svernut14 p, #sw_svernut15 p, #sw_svernut16 p, #sw_svernut17 p, #sw_svernut18 p, #sw_svernut19 p, #sw_svernut20 p, #sw_svernut21 p, #sw_svernut22 p, #sw_svernut23 p, #sw_svernut24 p, #sw_svernut25 p, #sw_svernut26 p, #sw_svernut27 p, #sw_svernut28 p, #sw_svernut29 p, #sw_svernut30 p, #sw_svernut31 p, #sw_svernut32 p, #sw_svernut33 p, #sw_svernut34 p, #sw_svernut35 p, #sw_svernut36 p, #sw_svernut37 p, #sw_svernut38 p, #sw_svernut39 p, #sw_svernut40 p, #sw_svernut41 p, #sw_svernut42 p, #sw_svernut43 p, #sw_svernut44 p, #sw_svernut45 p, #sw_svernut46 p, #sw_svernut47 p, #sw_svernut48 p, #sw_svernut49 p, #sw_svernut50 p {
font-size: 11pt;
margin-left: 2%;
color: #293d4f;
}
Получается, что прописывать к каждому отдельному div'у необходимые css ужасно долго и муторно, с учетом того, что по всей России огромное кол-во сервисных центров
Вы можете без проблем использовать другой класс вместе с cm-combination и hidden и ему задавать необходимые свойства, не затрагивая айдишники элементов.
Вы можете без проблем использовать другой класс вместе с cm-combination и hidden и ему задавать необходимые свойства, не затрагивая айдишники элементов.
О, точно, что-то я до этого не додумался, спасибо большое) Буду разгружать коды
Вы можете без проблем использовать другой класс вместе с cm-combination и hidden и ему задавать необходимые свойства, не затрагивая айдишники элементов.
Видимо я что-то делаю неправильно или не так понял, всё равно не открываются у меня другие вкладки, при нажатии на нижнюю строку, открывается верхняя
Вот как сделал:
Алтайский крайБарнаул
- Барнаул Газ-Сервис, ООО
Телефон: 8 (3852) 25-28-21, 8-903-947-78-21
E-Mail:
Сайт:
Адрес: Социалистический пр-кт, д. 24- Барнаулгоргаз, ООО
Телефон: 8 (3852) 28-40-00, 8 (3852) 53-22-25
E-Mail: rerv@mail.ru
Сайт: http://barnaulgorgaz.ru
Адрес: ул. Пушкина, д. 38- Магазин отопительного оборудования "Котел" (ТриоЦентр, ООО)
Телефон: 8 (3852) 60-21-32
E-Mail: info@gazset.ru
Сайт: http://gazset.ru
Адрес: ул. Тимуровская, д. 26- Газпром газораспределение Барнаул, АО
Телефон: 8-964-083-58-67, 8(3852) 25-28-21
E-Mail:
Сайт:
Адрес: пр-кт Социалистический, д. 24- Акватория (Аквастрой, ООО)
Телефон: 8 (3852) 35-80-08
E-Mail: info@akvatoria22.ru
Сайт: http://www.akvatoria22.ru/
Адрес: ул. Северо-Западная, д. 97- Dюйм (Стройинжиниринг, ООО)
Телефон: 8 (3852) 24-54-54, 8 (3852) 36-72-67
E-Mail: servissk@bk.ru
Сайт:
Адрес: пр-кт Строителей, д. 56Б- ПрофМонтажСервис, ООО
Телефон: 8-903-957-17-24, 8-913-210-50-95
E-Mail: prof-m-servis@mail.ru
Сайт:
Адрес: ул. Семенова, д. 9, кв. 39
css свойства "el1, el2 и т.д." не задавал, так как это не нужно, все цвета и размер шрифта выставлены в id
Айдишники должны быть уникальными, классы могут быть одинаковыми. У вас как-то наоборот
Айдишники должны быть уникальными, классы могут быть одинаковыми. У вас как-то наоборот
В пути на работу как раз об этом промелькнула мысль. Спасибо за помощь еще раз!)