Показать сообщение отдельно
  #5 (permalink)  
Старый 03.09.2011, 01:45
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

<html>
<head>
<script type="text/javascript">
window.onload = function () {
  var arayLink = document.getElementsByTagName('a'),
      totalLink = arayLink.length;

  while (totalLink--) {
    arayLink[totalLink].addEventListener('mouseover', havejpg, false);
  }

  function havejpg (e) {
    var div = document.createElement('div'); 
    if (e.target.href.match(/jpg$/)) {	//Проверяем, что в имени файла по ссылке расширение .jpg 
    //  alert('Ссылка содержит буквы jpg'); 
	x = e.clientX;
    y = e.clientY;
	div.style.position = 'absolute';
	div.style.left = x + 20;   // Координаты дива X и Y не забываем указать еденицы измерения,
	div.style.top = y + 20;    // например 40px или 20%
	div.style.background = 'green';   //  Див с зеленой заливкой ))
	div.appendChild(document.createTextNode('Я обычный текст'));  //  Добавим текст в див
	document.body.appendChild(div);

  //  Функция удаляет новый див
  function deleteDiv () {
    document.body.removeChild(div);   // Удаление дива
    //  Удаляем обработчик события "уход курсора с элемента" текущей ссылки
    e.target.removeEventListener('mouseout', deleteDiv, false);
  }
  //  Добавим обработчик события "уход курсора с элемента" текущей ссылки, будет вызвана функцыя deleteDiv 
  e.target.addEventListener('mouseout', deleteDiv, false);

    }
//    else {
//      alert('Ссылка не содержит буквы jpg'); 
//    }
  }
    
}
</script>
</head>
<body>
<a href="img.jpg"> Ссылка 1 </a><br />
<a href="my.txt"> Ссылка 2 </a><br />
<a href="here.mp3"> Ссылка 3 </a><br />
<a href="you.jpg"> Ссылка 4 </a><br />
<a href="i.png"> Ссылка 5 </a><br />
</body>
</html>
Ответить с цитированием