» »

Появление картинки из ссылки на 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.05.2016 Просмотров: 427 Комментарий: (5)

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

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

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