Как сделать чтобы менялся background в раскрывающемся меню
Как сделать, чтобы менялся background в раскрывающемся меню. "+" когда меню закрыто и "-" когда меню раскрыто.
Есть раскрывающееся меню: <div id="leftmenu"> <a href="#" class="lmenu">(сюда нужно поставить бекграунд плюс при закрытом меню и минус при раскрытом) Фото ремонта квартир</a> <div style="display:block; background-color: #e0e6ea;" id="menu1"> <a href="http://www.1.html" class="lmenu2">Комната</a> <a href="http://www.2.html" class="lmenu2">Кухня</a> <a href="http://www.3.html" class="lmenu2">Туалет</a></div> </div> Есть CSS: a.lmenu { font-size:12px; font-weight:bold; text-transform:uppercase; padding:7px 7px 7px 5px; display:block; color:#FFFFFF; font-weight:bold; text-decoration:none; [B]background-image: url(images/plus.png);[/B] width:218px; text-align:left; } a.lmenu2 { font-size:13px; text-decoration:none; display:block; margin-left: 10px; background-image: url(images/arrow.png); background-repeat: no-repeat; background-position: left top; font-weight: bold; width:223px; padding:10px 10px 7px 10px; display:block; margin-left: 20px; background-color: #FFFFFF; text-align:left; } Есть Javaskript: /* jQuery */ jQuery(function($){ /* left menu animation */ /*$('a.lmenu:not(:last)').click(function (ev) {*/ $('#leftmenu a.lmenu[href=#]').click(function (ev) { ev.preventDefault(); if ($(this).next().is(':visible')) { $(this).next().slideUp('slow'); } else { /* $(this).siblings('div').slideUp('slow');*/ $('#leftmenu').find('div:visible').slideUp('slow'); $(this).next().slideDown('slow'); } }); /* first page tabs */ /* $("#tabs1 ul,#tabs2 ul,#tabs3 ul").idTabs(function(id,list,set){ $("a",set).removeClass("selected") .filter("[href='"+id+"']",set).addClass("selected"); for(i in list) $(list[i]).hide(); $(id).fadeIn(); return false; }); */ $("#tabs1 ul,#tabs2 ul,#tabs3 ul").idTabs(); }); function callUrl(path) { $.colorbox({href:path}); return false; } Что добавить в CSS и JS, чтобы менялся background (plus.png), "+" когда меню закрыто и "-" когда меню раскрыто. Спасибо! |
наверно, как-то так
if ($(this).next().is(':visible')) { $(this).next().slideUp('slow').css('background-image', 'url(путь к файлу)'); } else { $('#leftmenu').find('div:visible').slideUp('slow').css('background-image', 'url(путь к файлу)'); $(this).next().slideDown('slow').css('background-image', 'url(путь к файлу)'); } |
Сделал как вы сказали.
$('#leftmenu a.lmenu,a.lmenu100[href=#]').click(function (ev) { ev.preventDefault(); if ($(this).next().is(':visible')) { $(this).next().slideUp('slow').css('background-image', 'url(images/menu5.jpg)'); } else { $('#leftmenu').find('div:visible').slideUp('slow').css('background-image', 'url(images/стрелка.png)'); $(this).next().slideDown('slow').css('background-image', 'url(images/стрелка.png)'); } }); |
Часовой пояс GMT +3, время: 12:28. |