Отображение разных изображений в разных местах одного основного изображения при наведении мыши - PullRequest
Новая
       29

Отображение разных изображений в разных местах одного основного изображения при наведении мыши

0 голосов
/ 09 сентября 2010

У меня есть одно основное изображение, которое я нанес на карту, чтобы иметь много разных горячих точек, которые ссылаются на другие изображения. То, что я хочу сделать - это всплывающие миниатюры этих изображений, когда пользователь пересекает горячие точки мышью. Как я могу это сделать? Имейте в виду, я новичок в HTML и едва знаю JavaScript ... есть ли простой выход?

1 Ответ

0 голосов
/ 09 сентября 2010

Насколько я могу подумать, вам нужно будет использовать JavaScript, хотя бы чуть-чуть ...

Я думаю, что Лучшее решение было бы примерно таким: 

<div id="mappedImage">
    <img src="bigImage.jpg">
    <div id="smallImage1">
        <img src="smallimage1.jpg">
    </div>
    <div id="smallImage2">
        <img src="smallimage2.jpg">
    </div>
</div>

И тогда вы можете расположить DIV внутри #mappedImage, используя position: absolute;И чтобы завершить, вы должны использовать JavaScript, чтобы скрыть «маленькие» DIV, и использовать onmouseover для тегов, которые вы их покажете.Код будет выглядеть примерно так: 

$(function() {
    $("#mappedImage div").hide();
    $("area#small1").hover(function(){
        $("#smallImage1").show();
    },function(){
        $("#smallImage1").hide();
    });
}

Надеюсь, это достаточно ясно.в противном случае просто оставьте здесь ваши оставшиеся сомнения:)

...