Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Всплывающий див около курсора (https://javascript.ru/forum/dom-window/15032-vsplyvayushhijj-div-okolo-kursora.html)

Andrejs 10.02.2011 14:33

Всплывающий див около курсора
 
Всем доброе время суток! Есть такая пороблема, нужен скрипт который будет отображать див при наведении на обьект, собственно я это сделал, главная проблема в том, что див должен отображаться в зависимости от положения курсора в окне браузера: грубо говоря если див правее середины экрана то слева если ниже середины то сверху и т.д. Главная проблема в том, что див может быть разных размеров, в зависимости от содержимого. Тут пример уже имеющегося скрипта:

var cX = 0; var cY = 0; var rX = 0; var rY = 0;
var posit = 0;
var halfX = screen.width/2;
var halfY = screen.height/2;

function UpdateCursorPosition(e){ cX = e.pageX; cY = e.pageY;} //e.pageX e.pageY tekusheje polozhenije kursora
function UpdateCursorPositionDocAll(e){ cX = event.clientX; cY = event.clientY;} // event.clientX evant.clientY pozicija kursora otnositelno zoni klijenta
if(document.all) { document.onmousemove = UpdateCursorPositionDocAll; } // document.all vse elementi na dvizhenije mishi srabativajet funkcija
else { document.onmousemove = UpdateCursorPosition; }


function AssignPosition(d) { //self.pageYOffset self.pageXOffset zna4enija stranici: esli ne prokru4ivajetsa to 0, 0; esli prokru4ivajetsa to pikseli
if(self.pageYOffset) {
rX = self.pageXOffset;
rY = self.pageYOffset;

}
else if(document.documentElement && document.documentElement.scrollTop) {
rX = document.documentElement.scrollLeft;
rY = document.documentElement.scrollTop;
}
else if(document.body) {
rX = document.body.scrollLeft;
rY = document.body.scrollTop;
}
if(document.all) {
cX += rX;
cY += rY;
}


if(cX-10 > halfX){posit =(cX-10)-halfX/2; d.style.left = posit + "px";} //esli pozicija kursora praveje seredini okna to div budet otobrazhatsa sleva
else{
d.style.left = (cX+10) + "px";
}
if(cY-10 > halfY){posit =(cY-10)-halfY/2; d.style.top = posit + "px";} //esli nizhe seredini okna, to div budet otobrazhatsa vverxu
else{
d.style.top = (cY+10) + "px";
}
}

function HideContent(d) {
if(d.length < 1) { return; }
document.getElementById(d).style.display = "none";
}
function ShowContent(d) {
if(d.length < 1) { return; }
var dd = document.getElementById(d);
AssignPosition(dd);
dd.style.display = "block";
}
function ReverseContentDisplay(d) {
if(d.length < 1) { return; }
var dd = document.getElementById(d);
AssignPosition(dd);
if(dd.style.display == "none") { dd.style.display = "block"; }
else { dd.style.display = "none"; }
}


Буду благодарен за помощь Ж)

Serg_pnz 11.02.2011 17:08

Посмотрите это http://www.jstoolbox.com/2008/06/05/...ript-vsego-2k/


Часовой пояс GMT +3, время: 07:50.