Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.80/5: Рейтинг темы: голосов - 5, средняя оценка - 4.80
-8 / 10 / 5
Регистрация: 18.12.2012
Сообщений: 81

Изменение картинки при наведении на нее мыши

26.09.2016, 09:57. Показов 1068. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здраствуйте всем нужна помощь у меня есть теги map area...И есть картинка ... Нужно чтоб при наведении мышки изменилась картинка как сделать?


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
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
 
<html>
<head>
    <title>Image</title>
</head>
<body>
  <script language="JavaScript" type="text/javascript">
 
  function change_image(image_name)
{document.mouseover.src = image_name}
 
  function reset_image()
{document.mouseover.src = "http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv.jpg";}
 
</script>
 
 
  <img src="http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv.jpg" usemap="#mouseover_map" name="mouseover"  />
 
<map id="image-map" name="mouseover_map">
 
  <area
  shape="poly"
  coords="0,115,151,130,164,113,234,121,233,506,-1,506"
  href="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-5.pdf"
  class=""
  title="Unite5"
  alt="Unite5"
  target="_blank"
  onMouseOver = "change_image('http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv1.jpg')"
  onMouseOut = "reset_image()" onClick="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-5.pdf" title="Unite5" />
 
  <area
  shape="poly"
  coords="235,143,366,157,364,149,382,141,441,149,438,504,235,506"
  href="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-4.pdf"
  class=""
  title="Unite4"
  alt="Unite4"
  target="_blank"
  onMouseOver = "change_image('http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv2.jpg')"
  onMouseOut = "reset_image()" onClick="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-4.pdf" title="Unite4" />
 
  <area
  shape="poly"
  coords="441,166,546,180,546,171,567,164,618,170,619,498,440,506"
  href="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-3.pdf"
  class=""
  title="Unite3"
  alt="Unite3"
  target="_blank"
  onMouseOver = "change_image('http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv3.jpg')"
  onMouseOut = "reset_image()" onClick="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-3.pdf" title="Unite3"/>
 
  <area
  shape="poly"
  coords="620,500,620,188,706,198,703,191,730,184,774,191,777,499"
  href="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-2.pdf"
  class=""
  title="Unite2"
  alt="Unite2"
  target="_blank"
  onMouseOver = "change_image('http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv4.jpg')"
  onMouseOut = "reset_image()" onClick="http://www.mrenaissance.com/wp-content/uploads/2016/09/CHEMIN-DU-GOLF_-UNITE-2.pdf" title="Unite2"/>
 
 
  <area
  shape="poly"
  coords="778,497,775,207,847,215,846,206,871,203,912,208,909,495"
  href="#"
  class=""
  title="Unite1"
  alt="Unite1"
  target="_blank"
  onMouseOver = "change_image('http://www.mrenaissance.com/wp-content/uploads/2016/09/golfGv5.jpg')"
  onMouseOut = "reset_image()" onClick="#" title="Unite1" />
 
    <!-- -->
</map>
 
</body>
</html>
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
26.09.2016, 09:57
Ответы с готовыми решениями:

Увеличение картинки при наведении на неё курсором мыши
Здравствуйте, подсакжите, как реализовать следующую задачу - на странице находится картинка, когда на неё наводишь курсор мыши, то она...

Изменение шрифта при наведении мыши
&lt;html&gt; &lt;head&gt; &lt;script type='text/javascript'&gt; function styl() { var w = document.getElementById(&quot;test&quot;); w.style.fontFamily =...

Изменение переменной при наведении мыши
Всем привет! У меня возник вопрос как сделать так что бы при наведении мыши на какой то объект изменилось значение переменной PHP? Вот...

1
20 / 21 / 6
Регистрация: 30.06.2015
Сообщений: 431
26.09.2016, 12:47
Ismoil, для начала обромляйте код, чтобы он красиво и читабельно отображался на странице.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
26.09.2016, 12:47
Помогаю со студенческими работами здесь

Изменение содержимого сайта при наведении мыши
в общем, имеется 2 контейнера, в первом несколько ссылок, и при наведении на них, во втором контейнере должно меняться содержимое, надо...

При наведении мыши изменение цвета текста и смещение
Задание: В документе представлен текст синим цветом. При наведении на нее мыши этот текст меняет цвет и смещается вниз и вправо, а затем...

Изменение картинки при нажатии на нее.
Привет всем. Пожалуйста помогите. Есть несколько картинок, на экране виден только один. Надо, чтоб при нажатии на нее картинка изменилась...

Изменение bgcolor таблицы при наведении на нее курсором
Доброго времени суток всем! такая ситуация: есть страница на которой циклом выведено несколько таблиц с одинаковым id, я написал код...

Изменение прозрачности картинки при клике на нее
Имеется вот такой css: .manager_yes{ opacity:1; /*прозрачность для всех*/ filter:alpha(opacity=100); /*прозрачность для...


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

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Автозаполнение реквизита при выборе элемента справочника
Maks 27.03.2026
Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. При выборе "Спецтехники" (Тип Справочник. Спецтехника), заполняется. . .
Сумматор с применением элементов трёх состояний.
Hrethgir 26.03.2026
Тут. https:/ / fips. ru/ EGD/ ab3c85c8-836d-4866-871b-c2f0c5d77fbc Первый документ красиво выглядит, но без схемы. Это конечно не даёт никаких плюсов автору, но тем не менее. . . всё может быть. . .
Автозаполнение реквизитов при создании документа
Maks 26.03.2026
Программный код из решения ниже размещается в модуле объекта документа, в процедуре "ПриСозданииНаСервере". Алгоритм проверки заполнения реализован для исключения перезаписи значения реквизита,. . .
Команды формы и диалоговое окно
Maks 26.03.2026
1. Команда формы "ЗаполнитьЗапчасти". Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. В качестве источника данных. . .
Кому нужен AOT?
DevAlt 26.03.2026
Решил сделать простой ланчер Написал заготовку: dotnet new console --aot -o UrlHandler var items = args. Split(":"); var tag = items; var id = items; var executable = args;. . .
Отправка уведомления на почту при создании или изменении элементов справочника
Maks 24.03.2026
Программная отправка письма электронной почты на примере типового справочника "Склады" в конфигурации БП3. Перед реализацией необходимо выполнить настройку системной учетной записи электронной. . .
модель ЗдравоСохранения 5. Меньше увольнений- больше дохода!
anaschu 24.03.2026
Теперь система здравосохранения уменьшает количество увольнений. 9TO2GP2bpX4 a42b81fb172ffc12ca589c7898261ccb/ https:/ / rutube. ru/ video/ a42b81fb172ffc12ca589c7898261ccb/ Слева синяя линия -. . .
Midnight Chicago Blues
kumehtar 24.03.2026
Такой Midnight Chicago Blues, знаешь?. . Когда вечерние улицы становятся ночными, а ты не можешь уснуть. Ты идёшь в любимый старый бар, и бармен наливает тебе виски. Ты смотришь на пролетающие. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru