Нужен самый малообъемный скрипт показа собственной подсказки при наведении на ссылку.
Нужен самый малообъемный скрипт показа собственной подсказки (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>
|
попробуй аргумент тега <a alt="подсказка"/>
намного меньше :) |
evgen28,
может все-таки title? нету у ссылок alt-а. это атрибут для рисунков |
точно title. Спасибо за поправку Gvozd.
|
Доп. вопрос по теме: тотже title но уже без onmouse... на объекте. при наведении на какой либо объект и если у него есть не пустой title то он его показывает. ка можно реализовать? =)
|
Вот самый малообъемный :)
<!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 |
В идеале скрипт должен сам найти все элементы с не пустыми alt или title, дописать к ним нужные обработчики и удалить/обнулить alt и title, что бы не вылезала стандартная подсказка. Т. е . верстальщик вообще не должен ни о чем беспокоиться.
|
Riim +1
А может теперь перейдем к реализации ;) Есть наброски? |
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*/
}
}
}
|
Вообще нужен обычный title, только через javascript.
Смысл вроде этого: <script language="JavaScript">
<!--
function s() { return 'qwe'+'asd'; }
// -->
</script>
<a href="..." title="javascript:s();">link</a>
Но это не работает и я не нашел как сделать. Нужен именно через javascript - просто записать текст в title не подходит. Я e-mail хочу спрятать. :) Хотя, если вернуться к самому началу, то стоило бы спросить как можно показать людям свой e-mail так, чтобы всякие роботы его не смогли вычислить. |
| Часовой пояс GMT +3, время: 00:28. |