Javascript.RU

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

Всплывающая подсказка
Помогите пожалуйста разобраться с подсказкой. Два дня сам мучал ничего не получается. Javascript на нулевом уровне пока.
1. Над, чтоб подсказка появлялась не "справа-ниже" от курсора, а "справа-выше". Тобиш получается, что мне над знать высоту подсказки чтоли...А как? Данные у меня динамически заполняется из мускула.
2. Как сделать чтоб когда курсор находится над подсказкой то подсказка не пряталась.
3. И как сделать чтоб когда курсор находится над подсказкой при щелчке мышкой подсказка бы пряталась

var myprompt=document.createElement('div');
myprompt.id='prompt';
myprompt.style.display='none';
myprompt.style.position='absolute';
myprompt.style.top='0px';
myprompt.style.left='0px';
myprompt.show_delay=100;
myprompt.hide_delay=0;
myprompt.cursor_shiftX=20;
myprompt.cursor_shiftY=0;
myprompt.prompt_elements=new Array('a');

function showPrompt(event){
    if(!event) event=window.event;
    if(myprompt.mustShow==undefined){
        if(myprompt.timer_id){
            window.clearInterval(myprompt.timer_id);
            myprompt.mustHide=undefined;
        }
        myprompt.next_message=this.prompt_text;
        myprompt.mustShow=true;
        myprompt.oldX=event.clientX+document.body.scrollLeft;
        myprompt.oldY=event.clientY+document.body.scrollTop;
        myprompt.timer_id=window.setInterval('showPrompt();',myprompt.show_delay);
    }else{
        window.clearInterval(myprompt.timer_id);
        myprompt.innerHTML=myprompt.next_message;
        myprompt.timer_id=undefined;
        myprompt.mustShow=undefined;
        myprompt.style.left=(myprompt.oldX+myprompt.cursor_shiftX)+'px';
        myprompt.style.top=(myprompt.oldY+myprompt.cursor_shiftY)+'px';
        myprompt.style.display='block';
    }
}
function hidePrompt(){
    if(myprompt.mustHide==undefined){
        if(myprompt.timer_id){
            window.clearInterval(myprompt.timer_id);
            myprompt.mustShow=undefined;
        }
        myprompt.mustHide=true;
        myprompt.timer_id=window.setInterval('hidePrompt();',myprompt.hide_delay);
    }else{
        window.clearInterval(myprompt.timer_id);
        myprompt.timer_id=undefined;
        myprompt.mustHide=undefined;
        myprompt.style.display='none';
    }
}
function refreshPromptCoords(event){
    if(myprompt.mustShow==undefined) return;
    if(!event) event=window.event;
    myprompt.oldX=event.clientX+document.body.scrollLeft;
    myprompt.oldY=event.clientY+document.body.scrollTop;
}
function setPromptEvents(){
    document.body.appendChild(myprompt);
    for(var k=0; k<myprompt.prompt_elements.length; k++){
        var anchors=document.getElementsByTagName(myprompt.prompt_elements[k]);
        for(var i=0; i<anchors.length; i++){
            var spans=anchors[i].getElementsByTagName('span');
            if(spans.length==0) continue;
            for(var j=0; j<spans.length; j++){
                if(spans[j].className=='prompt'){
                    anchors[i].prompt_text=spans[j].innerHTML;
                    break;
                }
            }
            if(!anchors[i].prompt_text) continue;
            anchors[i].onmouseover=showPrompt;
            anchors[i].onmouseout=hidePrompt;
            anchors[i].onmousemove=refreshPromptCoords;
        }
    }
}
if (typeof document.attachEvent!='undefined') window.attachEvent('onload',setPromptEvents);
else window.addEventListener('load',setPromptEvents,false);


вызывается как:

<style type="text/css">
div#prompt { padding: 4px;background:#FCF1C3;border:1px solid #999999;font-size:11px;color:#555555;width: 250px; }
span.prompt { display:none; }
</style>

<a href="">текст <span class="prompt">подсказка</span></a>
Ответить с цитированием
  #2 (permalink)  
Старый 16.09.2008, 17:28
Отправить личное сообщение для Андрей Параничев Посмотреть профиль Найти все сообщения от Андрей Параничев
 
Регистрация: 21.02.2008
Сообщений: 1,250

var myprompt=document.createElement('div');
myprompt.id='prompt';
myprompt.style.display='none';
myprompt.style.position='absolute';
myprompt.style.top='0px';
myprompt.style.left='0px';
myprompt.show_delay=100;
myprompt.hide_delay=1000;
myprompt.cursor_shiftX=20;
myprompt.cursor_shiftY=-25;
myprompt.prompt_elements=new Array('a');
 
function showPrompt(event){
    if(!event) event=window.event;
    if(myprompt.mustShow==undefined){
        if(myprompt.timer_id){
            window.clearInterval(myprompt.timer_id);
            myprompt.mustHide=undefined;
        }
        myprompt.next_message=this.prompt_text;
        myprompt.mustShow=true;
        myprompt.oldX=event.clientX+document.body.scrollLeft;
        myprompt.oldY=event.clientY+document.body.scrollTop;
        myprompt.timer_id=window.setInterval('showPrompt();',myprompt.show_delay);
    }else{
        window.clearInterval(myprompt.timer_id);
        myprompt.innerHTML=myprompt.next_message;
        myprompt.timer_id=undefined;
        myprompt.mustShow=undefined;
        myprompt.style.left=(myprompt.oldX+myprompt.cursor_shiftX)+'px';
        myprompt.style.top=(myprompt.oldY+myprompt.cursor_shiftY)+'px';
        myprompt.style.display='block';
    }
}
function hidePrompt(){
    if(myprompt.mustHide==undefined){
        if(myprompt.timer_id){
            window.clearInterval(myprompt.timer_id);
            myprompt.mustShow=undefined;
        }
        myprompt.mustHide=true;
        myprompt.timer_id=window.setInterval('hidePrompt();',myprompt.hide_delay);
    }else{
        window.clearInterval(myprompt.timer_id);
        myprompt.timer_id=undefined;
        myprompt.mustHide=undefined;
        myprompt.style.display='none';
    }
}
function refreshPromptCoords(event){
    if(myprompt.mustShow==undefined) return;
    if(!event) event=window.event;
    myprompt.oldX=event.clientX+document.body.scrollLeft;
    myprompt.oldY=event.clientY+document.body.scrollTop;
}
function setPromptEvents(){
    document.body.appendChild(myprompt);
    for(var k=0; k<myprompt.prompt_elements.length; k++){
        var anchors=document.getElementsByTagName(myprompt.prompt_elements[k]);
        for(var i=0; i<anchors.length; i++){
            var spans=anchors[i].getElementsByTagName('span');
            if(spans.length==0) continue;
            for(var j=0; j<spans.length; j++){
                if(spans[j].className=='prompt'){
                    anchors[i].prompt_text=spans[j].innerHTML;
                    break;
                }
            }
            if(!anchors[i].prompt_text) continue;
            anchors[i].onmouseover=showPrompt;
            anchors[i].onmouseout=hidePrompt;
            anchors[i].onmousemove=refreshPromptCoords;
			
			myprompt.onmouseout = hidePrompt;
			myprompt.onmouseover = function(){
				clearTimeout(myprompt.timer_id);
				myprompt.mustHide = undefined;
			}
			myprompt.onclick = function() {
				myprompt.mustHide = true;
				hidePrompt();
			}
        }
    }
}
if (typeof document.attachEvent!='undefined') window.attachEvent('onload',setPromptEvents);
else window.addEventListener('load',setPromptEvents,false);
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
всплывающая java script подсказка ehevnlem Элементы интерфейса 2 16.12.2008 16:57
Всплывающая подсказка SunYang Элементы интерфейса 14 12.06.2008 13:19
Всплывающее окошко, как подсказка при наведении на кнопку. rastafaray Общие вопросы Javascript 4 24.05.2008 00:55
Всплывающая таблица SunYang Общие вопросы Javascript 1 15.03.2008 01:02