У меня есть веб-сайт, созданный с помощью Wordpress Theme (Portfolio Press) - http://www.photos.robinbrittain.co.uk
По умолчанию имеется боковое меню, которое работает нормально. Я пытался добавить второе «Настраиваемое» меню, добавленное в качестве виджета ниже, чтобы оно выглядело так же, как и выше, но для доступа к различным веб-страницам, но у меня были некоторые проблемы с посещенными ссылками и фоновыми изображениями для кнопок в меню. , К сожалению, я новичок в этом.
Если я использую следующий код;
С моими посещенными ссылками кнопки меню меняют свойства по мере необходимости, например. Цвет фона, но он не восстанавливается и не очищается и не обновляется до своего первоначального состояния «не посещено», когда я впоследствии нажимаю на кнопки других элементов меню (кроме очистки истории браузера):
#sidebar li{list-style:none;}
#sidebar .widget_nav_menu a:link {color: ; background:#262626 url(images/menu_left.gif) no-repeat top left; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:17px; width:250px; display:block; }
#sidebar .widget_nav_menu a:visited {color: ; background:#161616 url(images/menu_left_hover.jpg) no-repeat top left; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:19px; width:250px;display:block;}
#sidebar .widget_nav_menu a:hover {color:#cccccc; background:#161616 url(images/menu_left_hover.jpg) no-repeat top left;}
#sidebar .widget_nav_menu a:active {color:#ccc; background:#262626 url(images/menu_left.gif) no-repeat top left;}
Коллега предложил удалить строку 'a: посещения', обнаружив проблему, вызывающую срабатывание (#sidebar .widget_nav_menu a: посещения ... и т. Д.). Я сделал это, и все работало в более новых версиях Браузера, таких как IE 9, но в более ранних, например, в IE 8, все меню с высотой кнопок будет сворачиваться и сдавливаться при навигации.
С тех пор я экспериментировал и обнаружил, что включив строку (полный код следует в конце этого сообщения): -
#sidebar .current_page_item a:visited {background:#161616 url(images/menu_left_hover.jpg) no-repeat top left; color: ; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:17px; width:250px; display:block}
Все это работает, за исключением того, что фоновые изображения для кнопок меню не отображаются должным образом, по крайней мере, в двух последних браузерах, которые я тестировал: IE и Firefox. Похоже, они не заполняют ширину кнопки. Я могу удалить ссылки на фоновые изображения, и меню навигации, кажется, работает очень хорошо, у меня просто нет изображений, которые обеспечивают закругленные углы для кнопок.
Поэтому я застрял и приветствовал бы любую помощь, пожалуйста. Как получить меню навигации с кнопками для изменения и возврата свойств между щелчками, а также для правильного отображения фоновых изображений.
Код, который у меня сейчас есть, с которым я застрял, выглядит следующим образом: -
#sidebar li{list-style:none;}
#sidebar .widget_nav_menu a:link {color: ; background:#262626 url(images/menu_left.gif) no-repeat top left; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:17px; width:250px; display:block; }
#sidebar .widget_nav_menu a:visited {color: ; background:#161616 url(images/menu_left_hover.jpg) no-repeat top left; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:19px; width:250px;display:block;}
#sidebar .current_page_item a:visited {background:#161616 url(images/menu_left_hover.jpg) no-repeat top left; color: ; font-size:13px; text-transform:none; font-style: italic; margin-bottom:10px; padding:8px 5px 5px 10px; height:17px; width:250px; display:block}
#sidebar .widget_nav_menu a:hover {color:#cccccc; background:#161616 url(images/menu_left_hover.jpg) no-repeat top left;}
#sidebar .widget_nav_menu a:active {color:#ccc; background:#262626 url(images/menu_left.gif) no-repeat top left;}
Большое спасибо,
С уважением,
Robin.