ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Появление картинки из ссылки на JavaScript

Появление картинки из ссылки на JavaScript

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

Выпадающее изображение из ссылки

Где применить и как разделить?

Код идет на 2 ссылки, вы можете оставить одну, там все прописано, где ссылка будет, где то описание, с которого будет производиться эффект. Но если нужна вам одна, вы просто убираете один код и все, просто здесь показано сразу на пару, что можно увидеть в демонстраций, что будет представлена.

Установка:

Прописываем в head:

Код
<script language = "JavaScript">
  function showLinkImage(id) {
  document.getElementById(id).style.display = "block";
  }
  function hideLinkImage(id) {
  document.getElementById(id).style.display = "none";
  }
</script>


Сама основа, где все и редактируется, ставим в body, наш HTML скрипт.

Код
<table align="center">
  <tr>
  <td align="center" valign="top">
  <a href="#" onmouseover="showLinkImage('float_1')" onmouseout="hideLinkImage('float_1')">
Изменяем логин » </a>
  <div id="float_1" style="display: none; position: absolute;">
  <img src="http://zornet.ru/_ld/66/30748545.jpg" alt="Фото 1" />
  </div>
  </td>
  <td align="center" valign="top">
  <a href="#" onmouseover="showLinkImage('float_2')" onmouseout="hideLinkImage('float_2')">Изображений на JavaScript</a>
  <div id="float_2" style="display: none; position: absolute;">
  <img src="http://zornet.ru/_ld/66/24894556.jpg" alt="Фото 2" />
  </div>
  </td>
  </tr>
</table>


Сам JavaScript вы можете поставить вверх или в низ сайта и пусть там установлен. А вот каркас, что будите только прописывать, нужно делать HTML, что можно переключится, но кроме форума.



Источник: Myrusakov.ru
13 Мая 2016 Просмотров: 1821 Комментариев: (5)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 4
Tergran
Tergran 13 Мая 2016 23:131
0
Что то подобное как помню было, и даже если не ошибаюсь с машиной, сейчас если что найду.
Kosten
Kosten 13 Мая 2016 23:192
0
Есть такого вида скрипт, но там только появление, там нельзя перейти по ссылки на другую страницу, это такое же приложение, но только с изображением, которое привязано к статье.
Сафрон
Сафрон 13 Мая 2016 23:313
0
Но это ближе к сайтам где один модуль стоит, все правильно на блоге, где также распространяют всякий разный материал.
feliksteg
feliksteg 13 Мая 2016 23:394
0
Редко, но можно встретить такой эффект а точнее скрипт на сайте где он применяется. Но это сайты оригинальных и там основном все свое выдают и как можно лучше оформляют тему, чтоб понятно было и здесь также нужно учитывать сам интерес.
avatar