| |
|
|
| | 1) есть оласть на сайте, по событию "onMouseOver" показываю "абсолютный слой" с информацией. Ширина слоя фиксирована, но может быть увеличена, если внутри широкий объект.
2) позиционирование производится относительно курсора - задача такая, взять за "базовый ноль" другую точку низя.
3) если область оказывается близко к правой границе экрана, то див частично не выводится (инфу не прочитать) + появляется нижний скролл...
а Теперь внимание вопрос.
КАК сделать так, чтобы:
- определялось, будет ли выходить див за границу окна (причем именно за границу ОКНА, даже если там есть еще контент самого сайта)
- если див будет "прятаться", то сделать горизонтальное положение таким, чтобы правая граница дива была в 5 пиксах от правой границы окна браузера
- а если ширина окна меньше ширины дива, то центрировать горизонтально, чтобы справа и слева были "спрятаны" за границей окна одинаковые части дива.
Код нужен кросс платформенный хотя бы в 3-х браузерах: IE, Mozilla, Opera. | |
| |
|
|
| |
|
|
| |
для: ZuArt
(14.03.2007 в 11:40)
| | | Хммм... странно, но почему то не пашет ни в одном браузере позиционирование через
document.getElementById('dInf').style.right = "0px";
|
хотя
document.getElementById('dInf').style.left = x + "px";
|
пашет на ура =((( | |
| |
|
|
| |
|
|
| |
для: ZuArt
(14.03.2007 в 12:29)
| | | потому что в первом случае, значение для Цсс обработчика в качестве параметра передается как строка, а во втором случае значение передается как число. вот и вся разница :) | |
| |
|
|
| |
|
|
| |
для: Lelik
(14.03.2007 в 13:00)
| | | При всем уважении Вы неправы... =)))
При сложении (без скобок имеется в виду) слагаемых разных типов, среди которых есть тип "строка" - все остальные слагаемые неявно приводятся к типу "строка" и сложение превращается в конкатенацию строк... так что как в первом так и во втором случае идет передача значений в виде строки...
Загвоздка в том, что свойство right относительно окна браузера не пашет вот и все... | |
| |
|
|
| |
|
|
| |
для: ZuArt
(14.03.2007 в 13:20)
| | | Загвоздка в том, что свойство right относительно окна браузера не пашет вот и все...
это шутка? | |
| |
|
|
| |
|
|
| |
для: Lelik
(14.03.2007 в 13:22)
| | | это не шутка - для абсолютных слоев, у которых нет "контейнера" этот параметр браузерами просто игнорируется.
А задачу я свою решил - правда повозиться пришлось, но решил =))) - выкладываю код, может кому и пригодится ;)
<script>
function MoveInf(ev)
{
var d = 2; // поле от границы окна
var c = 15; // смещение от курсора
var dInf = 'dInf'; // id дива
var x, y, min, max, w = document.getElementById(dInf).clientWidth + 3; // тут 3 - сумма толщины границ (border-left + border-right) по бокам дива
switch(navigator.appName)
{
case "Netscape":
x = ev.pageX; y = ev.pageY;
min = window.pageXOffset; max = min + window.innerWidth - 12; //подгонка, но подозреваю, что ширина скроллера окна
break;
case "Opera":
x = ev.clientX + document.body.scrollLeft; y = ev.clientY + document.body.scrollTop;
min = window.pageXOffset; max = min + window.innerWidth - 12; //подгонка, но подозреваю, что ширина скроллера окна
break;
default:
x = ev.clientX + document.body.scrollLeft; y = ev.clientY + document.body.scrollTop;
min = document.body.scrollLeft; max = min + document.body.clientWidth;
break;
};
x = x + c; y = y + c; min = min + d; max = max - d; // корректировка смещений
if ((x + w) > max) {x = max - w}; // если уходит за правую границу экрана
if (x < min) {x = x + Math.round((min-x)/2)}; // если уходит за левую границу окна
document.getElementById(dInf).style.top = y + "px";
document.getElementById(dInf).style.left = x + "px";
};
</script>
|
В коде HTML <... onMouseMove="JavaScript:MoveInf(event);"...>
Пользуйтесь - проверял под: IE6, Mozilla 1.7.12, FireFox 1.5.0.10, Opera 9.02. | |
| |
|
|
| |
|
|
| |
для: ZuArt
(14.03.2007 в 13:20)
| | | а в стилях для блока задан right:0; ? | |
| |
|
|
| |
|
|
| |
для: Lelik
(14.03.2007 в 13:23)
| | | в стилях указано тока абсолютное позиционирование и НЕвидимость - чтобы сначала окошко не отображалось - все! | |
| |
|
|
