Графики с изображениями в качестве графической карты или есть альтернативный метод? - PullRequest
0 голосов
/ 27 августа 2011

Мне нужно отобразить некоторые графические данные на веб-сайте.На этих графиках несколько изображений, которые при нажатии должны отображать увеличенную версию изображения.Сами диаграммы в настоящее время сохраняются в виде одного файла изображения.

Сначала я хочу использовать карту изображений, чтобы указать, где изображения находятся в общем изображении диаграммы, а затем использовать jQuery для выделения по краям изображений.Затем, используя что-то вроде лайтбокса или дисплея fancybox, нажмите на картинку большего размера.

Что бы я оценил, так это понимание того, является ли это наилучшим способом достижения желаемого результата или есть лучшая техника?1005 *

Спасибо

1 Ответ

1 голос
/ 28 августа 2011

Почему бы просто не использовать всплывающую подсказку?

Вот пример с использованием qTip2 с некоторым заимствованным кодом;)

HTML

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" />

<map name="planetmap">
    <area shape="rect" coords="0,0,82,126" alt="Sun" href="#" title="<img src='sun.gif'>" />
    <area shape="circle" coords="90,58,3" alt="Mercury" href="#" title="<img src='merglobe.gif'>" />
    <area shape="circle" coords="124,58,8" alt="Venus" href="#" title="<img src='venglobe.gif'>" />
</map>

Скрипт

$('area').qtip({
    position: {
        my: 'left center',
        at: 'right center',
        target: $('img')
    }
});
...