Еще разочек. Сейчас соображу...
window.addEventListener('mouseover', function(e) {
var cursorposX = e.pageX;
var cursorposY = e.pageY;
var margintop = cursorposY - 250;
var marginleft = cursorposX - 250;
if ( cursorposY < 250 ){
document.getElementsByTagName('span')[0].style.top="30px";
} else if ( cursorposY > margintop ) {
document.getElementsByTagName('span')[0].style.bottom="30px";
}
if ( cursorposX < 250 ){
document.getElementsByTagName('span')[0].style.left="125px";
} else if ( cursorposX > marginleft ) {
document.getElementsByTagName('span')[0].style.right="125px";
}
}, false);
1. Определяем позицию курсора по оси игрек
Допустим у нас высота 1000 пикселей.
Если курсор находится по высоте менее 250 пикселей, тогда подсказке задаем стиль - top:30px Так выводим подсказку снизу.
Если курсор находится по высоте больше чем 1000 минус 250 пикселей (то есть более 750 пикселей), тогда выводим подсказку сверху тем, что задаем ей стиль bottom: 30px;
Если курсор по высоте где то посередине, то ничего не делаем, подсказка отлично вписывается в экран
Ааа, сообразил, мне нужно получить высоту экрана