При наведении или клике курсора изменить другой элемент, как?

Question

[indee1]

Собственно вопрос в заголовке.

Чуть подробней:

В шапке сайта, допустим будет располагаться с лева макет машины и слева текст, меню.

Нужно сверстать так чтоб при наведении (или нажатии) на определенный элемент в машине, например на мотор, сбоку менялась информация на другую, и т д. т.е при наведении или нажатии на колесо менялась инфа.

Подскажите подобную библиотеку?

P/S: УТОЧНЮ ЧТО JQUERY Я ПОЛНЫЙ 0 :)

Answer 1

[Сергей]

Jquery там все есть для этого

Answer 2

[Александр Голубев]

Нужно делать через display none, вот пример: http://mentor-framework.ru/слайдер/

Это меню сделано по такому принципу,

Answer 3

[Денис]

Карта изображения, плюс, например, data-атрибут и получаете что-то в этом роде

<p class="info"></p>
<img alt="mashyna_taksy_nakleika_1_.jpg" src="http://i.piccy.info/i9/af7fb3ee41ec62c9160e3d6e8aec99c6/1445302105/40502/962048/mashyna_taksy_nakleika_1_.jpg" usemap="#myMap" width="459" height="459" />
<map name="myMap" id="myMap">
    <area shape="circle" coords="104,273,35" data-info="переднее колесо" />
    <area shape="circle" coords="351,272,36" data-info="заднее колесо"/>
    <area shape="poly" coords ="100,207,132,191,174,175,207,172,265,172,318,175,365,189,379,194,373,211,108,212"  data-info="стекло"/>
</map>

var output = $('.info'); // куда выводим
$('area').on({
    mouseenter: function(){
        output.text('Навели на ' + $(this).data('info'));
    },
    mouseleave: function(){
        output.text(''); // если надо...
    }
});