Отправляет email-рассылки с помощью сервиса Sendsay

RFpro.ru: Элементы HTML и CSS

  Все выпуски  

RFpro.ru: Элементы HTML и CSS


РАССЫЛКИ ПОРТАЛА RFPRO.RU

Лучшие эксперты в разделе

Evgen aka Chuma
Статус: 3-й класс
Рейтинг: 352
∙ повысить рейтинг »
Коцюрбенко Алексей aka Жерар
Статус: Мастер-Эксперт
Рейтинг: 304
∙ повысить рейтинг »
REDDS
Статус: 3-й класс
Рейтинг: 195
∙ повысить рейтинг »

∙ HTML / DHTML / XML / CSS

Номер выпуска:547
Дата выхода:15.11.2016, 17:15
Администратор рассылки:Коцюрбенко Алексей aka Жерар (Мастер-Эксперт)
Подписчиков / экспертов:19 / 15
Вопросов / ответов:1 / 1

Консультация # 190005: Здравствуйте! У меня возникли сложности с таким вопросом: Необходимо с помощью JavaScript создать горизонтальное меню из 7 кнопок с параметрами, указанными на картинке. ...

Консультация # 190005:

Здравствуйте! У меня возникли сложности с таким вопросом:
Необходимо с помощью JavaScript создать горизонтальное меню из 7 кнопок с параметрами, указанными на картинке.

Дата отправки: 10.11.2016, 16:58
Вопрос задал: Sergei V. Moroz / F®ost (Администратор)
Всего ответов: 1
Страница онлайн-консультации »


Консультирует REDDS (3-й класс):

Здравствуйте, Sergei V. Moroz / F®ost!

Код (HTML) :: выделить код
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=win-1251">
 <script language="javascript">
var default_color;
function mouseIn() {//при наведении курсора
  default_color = document.changecolorbutton.link1.style.background;
  document.changecolorbutton.link1.style.background = "black";//меняем цвет кнопки
  document.changecolorbutton.link1.style.color = "white"; //меняем цвет текста
}
function mouseOut() {//отвести мышку 
 document.changecolorbutton.link1.style.background = "white"; //исходный цвет кнопки
document.changecolorbutton.link1.style.color = "black";//исходный цвет текста
}

 function a() {//обьединяем все функции  mouseOut в одну для вызова их при загрузке страницы
    mouseOut()
    mouseOut2()
   mouseOut3()
   mouseOut4()
   mouseOut5()
   mouseOut6()
   mouseOut7()
   ;
  }


function mouseIn2() {
  default_color = document.changecolorbutton2.link2.style.background;
     document.changecolorbutton2.link2.style.background = "white";
document.changecolorbutton2.link2.style.color = "black";
}
function mouseOut2() {
document.changecolorbutton2.link2.style.background = "black";
  document.changecolorbutton2.link2.style.color = "white";
}

function mouseIn3() {
  default_color = document.changecolorbutton3.link3.style.background;
     document.changecolorbutton3.link3.style.background = "blue";
document.changecolorbutton3.link3.style.color = "white";
}
function mouseOut3() {
document.changecolorbutton3.link3.style.background = "white";
  document.changecolorbutton3.link3.style.color = "red";
}

function mouseIn4() {
  default_color = document.changecolorbutton4.link4.style.background;
     document.changecolorbutton4.link4.style.background = "yellow";
document.changecolorbutton4.link4.style.color = "black";
}
function mouseOut4() {
document.changecolorbutton4.link4.style.background = "black";
  document.changecolorbutton4.link4.style.color = "yellow";
}

function mouseIn5() {
  default_color = document.changecolorbutton5.link5.style.background;
     document.changecolorbutton5.link5.style.background = "white";
document.changecolorbutton5.link5.style.color = "blue";
}
function mouseOut5() {
document.changecolorbutton5.link5.style.background = "blue";
  document.changecolorbutton5.link5.style.color = "yellow";
}

function mouseIn6() {
  default_color = document.changecolorbutton6.link6.style.background;
     document.changecolorbutton6.link6.style.background = "black";
document.changecolorbutton6.link6.style.color = "yellow";
}
function mouseOut6() {
document.changecolorbutton6.link6.style.background = "yellow";
  document.changecolorbutton6.link6.style.color = "black";
}

function mouseIn7() {
  default_color = document.changecolorbutton7.link7.style.background;
     document.changecolorbutton7.link7.style.background = "yellow";
document.changecolorbutton7.link7.style.color = "red";
}
function mouseOut7() {
document.changecolorbutton7.link7.style.background = "white";
  document.changecolorbutton7.link7.style.color = "blue";
}


</script>
  <style type="text/css">
q1{
float:left;

}
  </style>


</head>
<body  onload="a();" >
<form name = "changecolorbutton">
  <input type="button" name="link1" class="q1"  value="link1" onclick='location.href="http://ссылка page1/"' onMouseOver="mouseIn()" onMouseOut="mouseOut()">
</form>
<form name = "changecolorbutton2">
  <input type="button" name="link2"  class="q1" value="link2" onclick='location.href="http://ссылка page2/"' onMouseOver="mouseIn2()" onMouseOut="mouseOut2()">
</form>
<form name = "changecolorbutton3">
  <input type="button" name="link3" class="q1" value="link3" onclick='location.href="http://ссылка page3/"' onMouseOver="mouseIn3()" onMouseOut="mouseOut3()">
</form>
<form name = "changecolorbutton4">
  <input type="button" name="link4" class="q1" value="link4" onclick='location.href="http://ссылка page3/"' onMouseOver="mouseIn4()" onMouseOut="mouseOut4()">
</form>
<form name = "changecolorbutton5">
  <input type="button" name="link5" class="q1" value="link5" onclick='location.href="http://ссылка page5/"' onMouseOver="mouseIn5()" onMouseOut="mouseOut5()">
</form>
<form name = "changecolorbutton6">
  <input type="button" name="link6" class="q1" value="link6" onclick='location.href="http://ссылка page3/"' onMouseOver="mouseIn6()" onMouseOut="mouseOut6()">
</form>
<form name = "changecolorbutton7">
  <input type="button" name="link7"  class="q1" value="link7" onclick='location.href="http://ссылка page3/"' onMouseOver="mouseIn7()" onMouseOut="mouseOut7()">
</form>


</body>
</html>

Консультировал: REDDS (3-й класс)
Дата отправки: 10.11.2016, 18:47

5
Спасибо.
-----
Дата оценки: 11.11.2016, 16:57

Рейтинг ответа:

НЕ одобряю +3 одобряю!


Оценить выпуск | Задать вопрос экспертам

главная страница  |  стать участником  |  получить консультацию
техническая поддержка

Дорогой читатель!
Команда портала RFPRO.RU благодарит Вас за то, что Вы пользуетесь нашими услугами. Вы только что прочли очередной выпуск рассылки. Мы старались. Пожалуйста, оцените его. Если совет помог Вам, если Вам понравился ответ, Вы можете поблагодарить автора - для этого в каждом ответе есть специальные ссылки. Вы можете оставить отзыв о работе портале. Нам очень важно знать Ваше мнение. Вы можете поближе познакомиться с жизнью портала, посетив наш форум, почитав журнал, который издают наши эксперты. Если у Вас есть желание помочь людям, поделиться своими знаниями, Вы можете зарегистрироваться экспертом. Заходите - у нас интересно!
МЫ РАБОТАЕМ ДЛЯ ВАС!


В избранное