Разные кликабельные области у логотипа

[Eirene]

Задача:

Есть логотип, часть его (дерево в кружочке) должно вести по ссылке, напр.на Главную,

при клике на остальную же часть нужно чтобы появлялось верхнее окошко.

Пока дошла до того, что внутри ссылки сделала область конкретно для дерева в круге:

<p class="logo"><a href="#">Mounthermon</a></p>

.header p.logo{
	float:left;
	width:239px;
	height:106px;
	text-indent:-900em;
	margin-top:-20px;
	background: url(../images/logo.png) no-repeat left top;
	position:relative;
	cursor:pointer;
}

.header p.logo a{
	display:block;
    border-radius:27px;
    height: 52px;
    left: 8px;
    position: absolute;
    top: 19px;
    width: 53px;
}

Написала:

$(document).ready(function(){
	$('p.logo').not('p.logo a').click(function(){
		$('.top-grey-block').slideToggle();
	});
});

Но, естественно оно реагирует на нажатие по дереву, оно ведь в области p.logo находится...

Как их сделать разнокликабельными?

Посмотреть страничку можно тут

[Avalon4eg]

http://htmlbook.ru/html/map

[Eirene]

http://htmlbook.ru/html/map

Вариант, конечно, но не очень удобный.

[Great Rash]

Почему неудобный?

[Eirene]

Почему неудобный?

Надо менять верстку ((

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

Думала может как-то на jQuery можно сделать эти исключения.

[amelice]

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

var logo = document.querySelector('.logo');

    logo.onclick = function(e) {
        e = e || window.event;
        var target = e.target || e.srcElement;

        if (target.nodeName == 'A') return;
        else{
            $('.top-grey-block').slideToggle(); // *
         }

    }

Вроде работает...

Edited June 8, 2012 by amelice

[nerv]

amelice,

1. При чем тут делегирование?

2. jQuery написан на javascript

[amelice]

amelice,

1. При чем тут делегирование?

2. jQuery написан на javascript

1. Не поняла суть вопроса.

2. Да, я в курсе.

[nerv]

>1. Не поняла суть вопроса.

допустим, при клике на правую половину твоего лого нужно переходить по одной ссылке, а на левую по другой. При этом лого должен быть единой картинкой.