Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.73/15: Рейтинг темы: голосов - 15, средняя оценка - 4.73
12 / 12 / 0
Регистрация: 29.08.2010
Сообщений: 613

смена изображений

02.09.2012, 20:16. Показов 2916. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
HTML5
1
2
3
4
<MAP NAME="map1">
<AREA  href="#" onclick="document.getElementById('captcha').src=document.getElementById('captcha').src.substr(-5,1)=='7'?'images/pic05.png':'images/pic07.png';return false;" SHAPE="rect" COORDS="552, 380, 683,515">
</MAP>
<img id="captcha" src="images/pic05.png" border="0" USEMAP="#map1" />
этот код, по нажатию на картинку pic05 меняет её на pic07(без обновления страницы), а после нажатия на pic07 меняет обратно на pic05, так вот помогите пожалуйста, нужно подредактировать код. В итоге должно появится, в начале pic05, после нажатия по ней, она меняется на pic07, после нажатия по pic07, она меняется на pic08, после нажатия на pic08 она меняется на pic05 и так по кругу дальше.
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
02.09.2012, 20:16
Ответы с готовыми решениями:

Смена изображений на листе
Доброго времени. Задача такова. есть некоторый текст. допустим обзац из нескольких строк. в этом абзаце скажет 3 ссылки. справо от этого...

Плавная смена изображений
Тема уже давно заезжена, но у меня немного другая проблема, ответ на которую я не нашла. На странице есть 9 div, в которых раположены...

Смена изображений с помощью псевдокласса :hover
&lt;div id=&quot;r1&quot;&gt; &lt;img src=&quot;images/magnitol.png&quot;&gt; &lt;/div&gt; div#r1:hover{ background:url(images/magnitolhov.png) } что тут не...

5
 Аватар для Бабуля
72 / 72 / 29
Регистрация: 10.08.2012
Сообщений: 202
02.09.2012, 21:25
Думаю простым CSS и HTML не отделаешься.

либо PHP, либо в JavaScript

в JavaScript например:

JavaScript
1
2
3
4
5
6
7
8
9
10
<img src="1.jpg" onClick="JavaScript:
if (this.src="1.jpg")
{
this.src="3.jpg";
}
else
{
this.src="1.jpg";
}
">
Чтобы вставить код Js:
HTML5
1
<script type="text/javascript">[сюда вставляй код]</script>
Вставлять между <head> </Head>
1
Эксперт JSЭксперт HTML/CSS
2436 / 1115 / 312
Регистрация: 23.06.2011
Сообщений: 3,529
02.09.2012, 21:33
картинки свои поставь
JavaScript
1
2
3
4
5
6
7
function capt4a(){
var obj, m;
obj=document.getElementById('captcha');
m=/\/pic([0-9]+)\.gif/.exec(obj.src);
obj.src=m[1]==5?'pics/pic07.gif':m[1]==7?'pics/pic08.gif':'pics/pic05.gif';
return false;
 };
1
12 / 12 / 0
Регистрация: 29.08.2010
Сообщений: 613
07.09.2012, 11:21  [ТС]
не получается, ни первый вариант, ни второй
0
Эксперт JSЭксперт HTML/CSS
2436 / 1115 / 312
Регистрация: 23.06.2011
Сообщений: 3,529
07.09.2012, 21:04
Все работает
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<title>w345</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251">
 
<script type="text/javascript">
function capt4a(){
var obj, m;
obj=document.getElementById('captcha');
m=/\/pic([0-9]+)\.gif/.exec(obj.src);
obj.src=m[1]==5?'pics/pic07.gif':m[1]==7?'pics/pic08.gif':'pics/pic05.gif';
return false;
 };
</script>
</head>
 
<body>
 
 
<img src="pics/pic05.gif" alt="" id="captcha">
<button onclick="capt4a();">кнопка</button>
 
</body>
</html>
1
12 / 12 / 0
Регистрация: 29.08.2010
Сообщений: 613
13.09.2012, 21:16  [ТС]
когда нажимаю на кнопку, первая картинка меняется на вторую, снова жму, третья показывается, снова жму ничего не происходит, а надо что бы по второму кругу: первая, вторая, третья и т.д.

Добавлено через 38 секунд
и желательно что бы можно было не обязательно 3 картинки а 2 и 4 тоже.

Добавлено через 52 минуты
разобрался сам, всем спасибо
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
13.09.2012, 21:16
Помогаю со студенческими работами здесь

Смена изображений на страничке при наведении на ссылки курсором мыши
Доброго времени суток! Вопрос такой: делаю сайт, в связи с чем возник вопрос: есть шапка, в которую вставлено еще одно отдельное...

Прыгает размер изображений в карусели изображений CSS
Здравствуйте, рад что нашел такой форум. Есть сайт 124print.ru/1102.html Подскажите пожалуйста как убрать адаптивность картинок в...

Смена изображений при обновлении страницы. Адаптивность изображений
Здравствуйте! Нашел скрипт, который изменяет изображение при обновлении страницы, он меня устраивает, но не могу понять, каким образом в...

смена изображений
Всем привет!!! У меня вот какая проблема: я записал в компонент Image картинку (будем называть её 1). Затем поставил событие...

Смена изображений
Хотел сделать аналог фотоальбома, чтобы при нажатии на маленькую картинку у меня отображалась большая. Для теста решил просто первую...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
ПЛИС
zxcha1ka_ 27.01.2026
AHDL Разработать программы для синтеза следующих устройств: 1. Параллельного регистра 4-х разрядного с синхронной загрузкой и асинхронным сбросом (обнулением); Пoмoгитe пoжaлyйстa
Загрузка PNG-файла с альфа-каналом с помощью библиотеки SDL3_image на Android
8Observer8 27.01.2026
Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .
влияние грибов на сукцессию
anaschu 26.01.2026
Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android
8Observer8 26.01.2026
Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .
Установка Android SDK, NDK, JDK, CMake и т.д.
8Observer8 25.01.2026
Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .
Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf
8Observer8 25.01.2026
Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly
8Observer8 24.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль
iceja 24.01.2026
Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru