Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.05.2009, 18:35
Интересующийся
Отправить личное сообщение для Tend Посмотреть профиль Найти все сообщения от Tend
 
Регистрация: 16.03.2009
Сообщений: 13

Нужен самый малообъемный скрипт показа собственной подсказки при наведении на ссылку.
Нужен самый малообъемный скрипт показа собственной подсказки (title) при наведении на ссылку.
Еще чтобы во всех браузерах работал.

Один есть, но нужен ну очень маленький по объему.
Вот этот есть:

<a href='#' onmouseover='hintshow(event,1);' onmouseout='hinthide();'>link1</a>
<a href='#' onmouseover='hintshow(event,2);' onmouseout='hinthide();'>link2</a>

<script language='JavaScript'>
<!--
function hinthide()
{
	var div = document.getElementById('hintdiv').style;
	div.visibility = 'hidden';
	div.display = 'none';
}
function hintshow(e,id)
{
	var e = e || window.event;
	var x = e.x || e.clientX;
	var y = e.y || e.clientY;
	var dtop = 10;
	var dleft = 15;
	var rightw = 500;
	var r = new Array();
	r[1] = 'Подсказка1';
	r[2] = 'Подсказка2';

	var div = document.getElementById('hintdiv');
	if ( !div )
	{
		div = document.createElement('div');
		div.id = 'hintdiv';
		div.style.backgroundColor = '#ffffff';
		div.style.border = 'solid #333333 1px';
		div.style.position = 'absolute';
		div.style.padding = '5px';
		document.body.appendChild(div);
		div = document.getElementById('hintdiv');
	}
	div.innerHTML = r[id];
	dst = div.style;
	var s;
	if ( typeof window.pageYOffset != 'undefined' )
	{ s = window.pageYOffset; }
	else if ( typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat' )
	{ s = document.documentElement.scrollTop; }
	else if ( typeof document.body != 'undefined' )
	{ s = document.body.scrollTop; }
	dst.top = s+y+dtop;
	if ((screen.width-(rightw+50))<(x+dleft)) { dst.left = x - rightw; } else { dst.left = x + dleft; }
	dst.visibility = 'visible';
	dst.display = 'block';
}
// -->
</script>
Ответить с цитированием
  #2 (permalink)  
Старый 15.05.2009, 09:16
Аспирант
Отправить личное сообщение для evgen28 Посмотреть профиль Найти все сообщения от evgen28
 
Регистрация: 21.01.2009
Сообщений: 38

попробуй аргумент тега <a alt="подсказка"/>
намного меньше
Ответить с цитированием
  #3 (permalink)  
Старый 15.05.2009, 09:37
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 03.04.2008
Сообщений: 6,245

evgen28,
может все-таки title? нету у ссылок alt-а. это атрибут для рисунков
Ответить с цитированием
  #4 (permalink)  
Старый 15.05.2009, 09:55
Аспирант
Отправить личное сообщение для evgen28 Посмотреть профиль Найти все сообщения от evgen28
 
Регистрация: 21.01.2009
Сообщений: 38

точно title. Спасибо за поправку Gvozd.
Ответить с цитированием
  #5 (permalink)  
Старый 15.05.2009, 10:45
Аспирант
Отправить личное сообщение для clgs Посмотреть профиль Найти все сообщения от clgs
 
Регистрация: 19.09.2008
Сообщений: 32

Доп. вопрос по теме: тотже title но уже без onmouse... на объекте. при наведении на какой либо объект и если у него есть не пустой title то он его показывает. ка можно реализовать? =)
Ответить с цитированием
  #6 (permalink)  
Старый 15.05.2009, 11:10
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

Вот самый малообъемный
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<table style="border-collapse:collapse;border:1px solid gray">
  <thead title="head" style="border:1px solid #e0e0e0"><tr><th>HEAD</th></tr></thead>
  <tfoot title="foot" style="border:1px solid #ccc"><tr><td>FOOT</td></tr></tfoot>
  <tbody title="body" style="border:1px solid #aaa"><tr><td>BODY</td></tr></tbody>
</table>
</body>
</html>

title можно чему хочешь указать, и если он есть -- отобразится. Если нужна специфическая подсказка -- ну тогда mouseover/mouseout
Ответить с цитированием
  #7 (permalink)  
Старый 15.05.2009, 14:41
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

В идеале скрипт должен сам найти все элементы с не пустыми alt или title, дописать к ним нужные обработчики и удалить/обнулить alt и title, что бы не вылезала стандартная подсказка. Т. е . верстальщик вообще не должен ни о чем беспокоиться.
Ответить с цитированием
  #8 (permalink)  
Старый 15.05.2009, 15:43
Аспирант
Отправить личное сообщение для clgs Посмотреть профиль Найти все сообщения от clgs
 
Регистрация: 19.09.2008
Сообщений: 32

Riim +1
А может теперь перейдем к реализации Есть наброски?
Ответить с цитированием
  #9 (permalink)  
Старый 15.05.2009, 15:48
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 03.04.2008
Сообщений: 6,245

clgs,
а в чем проблема-то?)
переходи к реализации.
вот наброски
window.onload=funciton(){
var all=document.getElementsByTagName('*');
for(var i=0;i<all.length;i++){
var title=(all[i].alt||all[i].title);
if(title){
/*some magic*/
}
}
}
Ответить с цитированием
  #10 (permalink)  
Старый 15.05.2009, 19:07
Интересующийся
Отправить личное сообщение для Tend Посмотреть профиль Найти все сообщения от Tend
 
Регистрация: 16.03.2009
Сообщений: 13

Вообще нужен обычный title, только через javascript.
Смысл вроде этого:
<script language="JavaScript">
<!--
function s() { return 'qwe'+'asd'; }
// -->
</script>

<a href="..." title="javascript:s();">link</a>

Но это не работает и я не нашел как сделать.
Нужен именно через javascript - просто записать текст в title не подходит.
Я e-mail хочу спрятать.

Хотя, если вернуться к самому началу, то стоило бы спросить как можно показать людям свой e-mail так, чтобы всякие роботы его не смогли вычислить.

Последний раз редактировалось Tend, 15.05.2009 в 19:09.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Появление текста при наведении курсора на ссылку Александра Элементы интерфейса 1 10.05.2009 23:22
Изменение изображения при наведении на ссылку MDS Общие вопросы Javascript 1 08.08.2008 20:54