X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

Открыть тему
Тема закрыта
> Нужно чтобы текст появлялся при наведении на картинку.
antiblef
antiblef
Topic Starter сообщение 28.12.2010, 1:54; Ответить: antiblef
Сообщение #1


Бывалый
****

Группа: User
Сообщений: 263
Регистрация: 22.10.2010
Поблагодарили: 44 раза
Репутация:   1  


Здравствуйте. Ищу код, чтобы текст появлялся при наведении на картинку. Думаю легко можно реализовать через java.
Сам языка не знаю, поэтому и отрыл эту ветку.
Просто есть картинка, наводиш на неё и всплывает и появляется текст, который двигается за мышкой, пока мышка на картинке.
Буду признателен, если мне кто-нибуть поможет.
-1
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Netbloga
Netbloga
сообщение 28.12.2010, 2:02; Ответить: Netbloga
Сообщение #2


Участник
***

Группа: User
Сообщений: 174
Регистрация: 6.9.2010
Поблагодарили: 100 раз
Репутация:   30  


тэг Title не пробовали?


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Nikson
Nikson
сообщение 28.12.2010, 2:26; Ответить: Nikson
Сообщение #3


Рембо
******

Группа: Active User
Сообщений: 1417
Регистрация: 28.11.2009
Из: Россия
Поблагодарили: 266 раз
Репутация:   75  


Пропишите Title для картинки, делов то...


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Jepps
Jepps
сообщение 28.12.2010, 2:49; Ответить: Jepps
Сообщение #4


Топовый постер
*******


Группа: Banned
Сообщений: 3062
Регистрация: 22.11.2009
Из: Москва
Поблагодарили: 1259 раз
Репутация:   178  


antiblef, jQuery вам в помощь.


--------------------
Забанен за игнорирование обязательств по оплате труда (случай #2) и оскорбление администрации.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Honey
Honey
сообщение 28.12.2010, 3:17; Ответить: Honey
Сообщение #5


Новичок
*

Группа: Viewer
Сообщений: 3
Регистрация: 29.6.2010
Поблагодарили: 1 раз
Репутация:   0  


Их называют хинтами (hint), они выводят содержимое alt'ов или title'ов. В интернете этих скриптов много.
Пример.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
kzn
kzn
сообщение 28.12.2010, 3:30; Ответить: kzn
Сообщение #6


Бывалый
****

Группа: User
Сообщений: 345
Регистрация: 29.11.2009
Из: Казань
Поблагодарили: 187 раз
Репутация:   41  


всплывает и появляется текст, который двигается за мышкой

Господа, какой ещё title? facepalm.gif

Вот на JS. Нужные места откомментировал, поэтому, подогнать под себя не составит труда.
<HTML>
<HEAD>
<TITLE>Собственно скриптик...</TITLE>

<META http-equiv=Content-Type content="text/html; charset=windows-1251">

<style type="text/css">
<!--

#pup {position:absolute; visibility:hidden; z-index:200; width:130; }

//-->
</style>

</HEAD>
<BODY>

<script type="text/javascript">
<!--

var Xoffset=-60;        // позиция окошка по иксу
var Yoffset= 20;        // и соответственно по игрику
var popwidth=130;       // ширина подсказки
var bcolor="darkgray";  // цвет границы подсказки
var fcolor="black";     // цвет текста
var fface="verdana";    // шрифт

// create content box
document.write("<DIV ID='pup'></DIV>");

// id browsers
var iex=(document.all);
var nav=(document.layers);
var old=(navigator.appName=="Netscape" && !document.layers && !document.getElementById);
var n_6=(window.sidebar);

// assign object
var skin;
if(nav) skin=document.pup;
if(iex) skin=pup.style;
if(n_6) skin=document.getElementById("pup").style;

// park modifier
var yyy=-1000;

// capture pointer
if(nav)document.captureEvents(Event.MOUSEMOVE);
if(n_6) document.addEventListener("mousemove",get_mouse,true);
if(nav||iex)document.onmousemove=get_mouse;

// set dynamic coords
function get_mouse(e)
{
  var x,y;

  if(nav || n_6) x=e.pageX;
  if(iex) x=event.x+document.body.scrollLeft;
  
  if(nav || n_6) y=e.pageY;
  if(iex)
  {
    y=event.y;
    if(navigator.appVersion.indexOf("MSIE 4")==-1)
      y+=document.body.scrollTop;
  }

  if(iex || nav)
  {
    skin.top=y+yyy;
    skin.left=x+Xoffset;
  }

  if(n_6)
  {
    skin.top=(y+yyy)+"px";
    skin.left=x+Xoffset+"px";
  }    
  nudge(x);
}

// avoid edge overflow
function nudge(x)
{
  var extreme,overflow,temp;

  // right
  if(iex) extreme=(document.body.clientWidth-popwidth);
  if(n_6 || nav) extreme=(window.innerWidth-popwidth);

  if(parseInt(skin.left)>extreme)
  {
    overflow=parseInt(skin.left)-extreme;
    temp=parseInt(skin.left);
    temp-=overflow;
    if(nav || iex) skin.left=temp;
    if(n_6)skin.left=temp+"px";
  }

  // left
  if(parseInt(skin.left)<1)
  {
    overflow=parseInt(skin.left)-1;
    temp=parseInt(skin.left);
    temp-=overflow;
    if(nav || iex) skin.left=temp;
    if(n_6)skin.left=temp+"px";
  }
}

// write content & display
function popup(msg,bak)
{

  var content="<TABLE WIDTH='"+popwidth+"' BORDER='1' BORDERCOLOR="+bcolor+" CELLPADDING=2 CELLSPACING=0 "+"BGCOLOR="+bak+"><TD ALIGN='center'><FONT COLOR="+fcolor+" FACE="+fface+" SIZE='2'>"+msg+"</FONT></TD></TABLE>";

  if(old)
  {
    alert(msg);
    return;
  }
  
  yyy=Yoffset;
  skin.width=popwidth;

  if(nav)
  {
    skin.document.open();
    skin.document.write(content);
    skin.document.close();
    skin.visibility="visible";
  }

  if(iex)
  {        
    pup.innerHTML=content;
    skin.visibility="visible";
  }  

  if(n_6)
  {  
    document.getElementById("pup").innerHTML=content;
    skin.visibility="visible";
  }
}


// park content box
function kill()
{
  if(!old)
  {
    yyy=-1000;
    skin.visibility="hidden";
    skin.width=0;
  }
}

//-->
</script>

<!-- Ну а теперь переходим от странныъ закарючек JavaScript к простому и привычному =============================================================-->


<!-- вместо lilguys.gif прописываете свою картинку ===============================-->
<IMG height=123 alt="" src="lilguys.gif" width=167 useMap=#lilguys border=0>
<MAP name=lilguys>
<!-- magenta - это цвет фона, в данном случае розовый(пурпурный). Прописываете нужный =======-->
<AREA onmouseover="popup('Текст всплывающего окошка','magenta')" onmouseout=kill() shape=RECT coords=0,0,123,167 href="java script://">
<!-- coords=0,0,123,167 - это координаты откуда до куда будет показываться подсказка. Как можно догадаться,
сделать таких подсказок можно неограниченное количество, копируя и вставляя одно и то же, не забывая заменить координаты, текст и цвет.
================================================================================
==-->
</MAP>

</BODY></HTML>


Сообщение отредактировал kzn - 28.12.2010, 3:31


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Fiamma
Fiamma
сообщение 30.12.2010, 1:17; Ответить: Fiamma
Сообщение #7


Участник
***

Группа: Banned
Сообщений: 222
Регистрация: 13.5.2010
Из: Минск
Поблагодарили: 13 раз
Репутация:   6  


Может просто alt картинке прописать, а потом CSS заюзать... И будет все удобно, красиво и без лишнего кода.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
antiblef
antiblef
Topic Starter сообщение 3.1.2011, 0:13; Ответить: antiblef
Сообщение #8


Бывалый
****

Группа: User
Сообщений: 263
Регистрация: 22.10.2010
Поблагодарили: 44 раза
Репутация:   1  


(Fiamma @ 30.12.2010, 0:17) *
Может просто alt картинке прописать, а потом CSS заюзать... И будет все удобно, красиво и без лишнего кода.

А что в css писать, чтобы все было красиво и удобно?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
rjksdfhe
rjksdfhe
сообщение 3.1.2011, 0:23; Ответить: rjksdfhe
Сообщение #9


Straight arms
*******

Группа: Active User
Сообщений: 2760
Регистрация: 21.4.2009
Из: Мытищи, МО, РФ
Поблагодарили: 1111 раз
Репутация:   163  


antiblef, title прописать картинке/блоку. Это самое простое для вас.
А на счёт красиво и удобно только через обращение к программистам JS.
Сами вы это не осилите, вижу уже.

Сообщение отредактировал rjksdfhe - 3.1.2011, 0:24
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
wagan
wagan
сообщение 3.1.2011, 0:38; Ответить: wagan
Сообщение #10


Участник
***

Группа: User
Сообщений: 159
Регистрация: 27.12.2010
Из: м.о. Люберцы
Поблагодарили: 50 раз
Репутация:   12  


Поковыряйте здесь efimov.ws сайт не мой, есть интересные jQuery плагины
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Переносится ли вес и тИЦ от входящих ссылок при 301 редиректе
11 Bel_Ami 2917 11.12.2017, 20:50
автор: alexandrrr
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыОшибка при создании шаблона страницы ВП
Нет картинок
5 semarg 713 9.12.2017, 15:36
автор: Nell
Открытая тема (нет новых ответов) Нужно перенести действующий интернет-магазин на CMS
Возможные CMS: PrestaShop, Битрикс, Magento, OpenCart
2 4aa19 330 8.12.2017, 17:59
автор: 4aa19
Горячая тема (нет новых ответов) Копирайтинг и рерайт: качественный сео-текст по доступной цене!
312 Sostavitel 91135 8.12.2017, 12:30
автор: Sostavitel
Горячая тема (нет новых ответов) 300 площадок под вечные ссылки на выбор: ТИЦ 20-9400, PR 0-6, ЯК, DMOZ. Скидки при пакетном заказе!
61 inkon 14032 7.12.2017, 20:28
автор: inkon


 



RSS Текстовая версия Сейчас: 17.12.2017, 19:52
Дизайн