2014-01-31 15 views
0

Я использую javascript (с очень ограниченными знаниями) для обмена изображениями, но теперь хочу сделать это с текстом.Изменить текст абзаца при нажатии

Мой вопрос: если у меня есть 10 различных абзацев (ссылка 1 показывает параграф 1, ссылка 2 показывает параграф 2 и т. Д.), Я не понимаю, где я могу «набрать» их. Мои изображения явно ссылаются на готовый файл, но я хочу, чтобы мой текст, чтобы оставаться в виде текста, и я не знаю, как я задаю этот в любом CSS или HTML и т.д.

КОД ИСПОЛЬЗУЕТСЯ:

До сих пор у меня есть мой CSS код, чтобы определить мое содержание текста (что я хочу изменить в зависимости от мыши) и мое содержание карты, где я контролирующий изменение в тексте:

#content 
    #content div {float:left;} 
    #content_map {width:595px;}  
    #content_text {width:290px;;} 
    #content_profile {width:900px;} 

так что мой HTML до сих пор для горячих точек на карте « 'приведены в качестве примера:

<area shape="circle" coords="276,326,15" href="#" alt="Kinnloch" onclick="MM_swapImage('stboswells_01','','discover_kinnloch.png',1)"/> 
    <area shape="circle" coords="202,264,11" href="#" alt="Lochinver" onclick="MM_swapImage('stboswells_01','','discover_lochinver.png',1)"/> 

... и т.д.

поэтому в основном я обменивать изображения в «профиле» DIV координатами на «карте» ДИВ и то, что я хочу сделать, это использовать эти координаты также SWOP в тексте в моем 'text' div, поэтому первый набор коордов изменит мой текст div на «Параграф 1», а второй набор координат изменит мой текстовый div на «Параграф 2» и т. д.

+0

Я только редактировал свой запрос, чтобы отнести тот факт, текст является параграф. – user3251016

ответ

0

Если вы используете jQuery вы можете добавить класс к каждому area элементу, то цель его следующим образом:

$(".areaClass").click(function(){ 
    $("your text div id/class").text("Discover " + $(this).attr("alt")); 
}); 

Вот Пример http://jsfiddle.net/Vphf2/

Я изменил area на якорь ссылки, так что он будет отображаться на экране, но он должен работать так же для Вашего случая, а

+0

Благодарим вас за помощь. Текст на самом деле является абзацем длинного текста - есть ли другой способ его хранения без использования alt? – user3251016

+0

Не совсем уверен, что вы имеете в виду, но это я немного изменил образец здесь http://jsfiddle.net/Vphf2/1/ – Sean

Смежные вопросы