Zh YandexMap PlacemarkGroupControl/ru

Расположение списка групп горизонтально

В ряде случаев возникает желание при управлении метками через список групп расположить список групп горизонтально.

Открываем слайдер Placemark Groups

Для начала определим положение списка сверху, причем это будет div-верстка.

Для этого указываем для расположения списка групп Placemark Control значение Group-Map

Указываем для поля Placemark Group CSS, что будем использовать External стиль, т.е. стиль будем определять в своем шаблоне.

После чего внешний вид списка будет приблизительно таким

Далее идем в стили шаблона (template.css или другой используемый файл стилей).

Добавляем стили для ul и li тегов.

#YMapsMenu-external #zhym-menu-external li
{
  list-style-type: none;
  display: inline;
}

#YMapsMenu-external ul
{
margin-left: 0;
padding: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

Смотрим, что получилось

Далее попробуем немного 'оживить' внешний вид

Добавляем следующий код

#YMapsMenu-external a
{
padding: 3px;
background-color: #369;
border-bottom: 1px solid #fff;
display: inline;
}

#YMapsMenu-external a:link, #zhym-menu-external a:visited
{
color: #fff;
text-decoration: none;
}

#YMapsMenu-external #zhym-menu-external a.active {
background-color: #035;
color: #bbb;
                    }
#YMapsMenu-external a:hover
{
background-color: #036;
color: #eee;
}

Ну а теперь список групп вот такой

Language:	English  • русский