Большая проблема с размещением меню

[zomzom]

Скачал прикольное выпадающее меню на JavaScrip, но вот проблема - мне нужно его вшурупить в сайт который позиционируется по центру и к тому же в ячейку таблицы- вот ссылка на оригинал ( http://packall.ru/1/index.html ) а вот ссылка на то, что у меня получается (после изменения параметра position:absolute на relative и привязке скрипта к нужной ячейке) ( http://packall.ru/z1/zom001.html ) скрипт делает все правильно, только вот отформатирована ячейка не так как надо:

Я плохо знаком с яваскриптами и как правило ими не пользуюсь, но дюже уж менюшка понравилась. К тому же, как я понял тут в общем дело не в самом скрипте а в контейнере к которому он привязан, а контейнер создается на основе CSS:

я так понимаю за расположение данного меню отвечает эта секция:
<style type="text/css">
DIV.clSlide{position:absolute; ;z-index:10; left:0; width:138; height:22; clip:rect(0,138,22,0); padding:3px;}
DIV.clSlideSub{position:absolute; ;z-index:10; padding:2px; clip:rect(0,127,20,0); width:127; height:20; left:8; visibility:hidden}
DIV.clSlideSub2{position:absolute; ;z-index:10; padding:2px; clip:rect(0,118,20,0); width:118; height:20; left:8; visibility:hidden}
#divSlideCont{position:absolute; z-index:10; left:0; top:100; height:600; width:170; visibility:hidden}
A.clSlideLinks{font-family:Verdana, Helvetica, Helv; font-size:11px; font-weight:bold; text-decoration:none; color:white}
A.clSlideSubLinks{font-family:Verdana, Helvetica, Helv; font-size:10px; text-decoration:none; color:Navy}
A.clSlideSub2Links{font-family:Verdana, Helvetica, Helv; font-size:9px; text-decoration:none; color:Navy}
</style>
Которая располагается в голове страницы.
А далее по скрипту идут ссылки на те контейнеры и слои которые созданы и спозиционированны по левому краю.

Прошу помощи.

Помогите разобраться, как вставить данное меню в ячейку таблицы - вернее можно сказать как вставить данный выше контейнер в ячейку тадлицы?((

[Hulio]

боюсь что менюшка немного морально устарела...
имхо, в твоем случае нужно написать скрипт котрый позиционирует дивизион (div) в зависимости от разрешения экрана, что по современным меркам сделать очень непросто, поскольку разрешений экранов много...

вариант - подгружаемая css:

Код: Выделить всё

if (screen.width <= 800)
{
document.write("ПУТЬ К CSS")
}
else if(screen.width >= 1280)
{
document.write("ПУТЬ К CSS2")
}
else
{
document.write("ПУТЬ К CSS3")
}

релативная позиция не поможет...

ну и мое решение не блещет изяществом =))

[zomzom]

мне по сути не важно отношение меню к разрешению экрана - если ее воткнуть в определенную ячейку таблицы (я так думаю), которая как раз и имеет плавающие параметры отображения- зависящие от разрешения, то меню будет неизменно - если получится создать контейнер привязанный только к ячейки таблицы.

Вот сюда все и упирается - как создать контейнер для слоев в нетри ячейки таблицы?(

[Muerto]

2zomzom:

Вот сюда все и упирается - как создать контейнер для слоев в нетри ячейки таблицы?(

В таком случае у тебя при появлении слоёв будет раздвигаться эта ячейка на высоту слоя.

[zomzom]

Это я знаю, поэтому нужно сделать эту ячейку заведомо - с высотой по максимуму от размера слоя.

[Hulio]

>если ее воткнуть в определенную ячейку таблицы (я так думаю), которая как раз и имеет плавающие параметры отображения- зависящие от разрешения, то меню будет неизменно

не бут работать
слой имеет абсолютную привязку
relative это от луквого =))

[zomzom]

Я не сильно понял, что ты хотел сказать((

Вот что получается когда я вставляю скрипт в отдельную ячейку http://packall.ru/z1/zom001.html - и это потому, что контейнер со слоями остается по левому краю.

[Berezkin]

А если у ячейки поставить ширину? По идее тогда не будет размножаться вбок все

[Hulio]

>А если у ячейки поставить ширину?
все равно встает рачком

>Вот сюда все и упирается - как создать контейнер для слоев в нетри ячейки таблицы?(

не бывает такого. див сам по себе самодостаточный контейнер и ты для него описываешь параметры, а затем хочешь эти параметры изменить вогнав его в релативно расположенную (прощитаную браузером юзера в зависимости от разрешения его экрана) ячейку таблицы

с хера оно у тебя бут корректно отображаццо?
ты указал координаты слоя + position: relative; вот он иложиццо у тебя как бог на душу положит. Теоретически можно даже прощитать куда...

position: relative не применяется при указании лефт и топ
данная конструкция предназначена для работы с релативно расположенными слоями без указания координат с параметрами флот и клер (обтеч (мля =)))))) ОБТЕЧЬ и вырезать) в том случае если весь диз построен на слоях

собственно полюбому в твоем случае придется щитать разрешение, абсолютно размещать слои, как бы над табличкой и либо переписывать твой скрипт менюхи, который это делать не умеет, либо брать другой, либо подгружать новую цсс для каждого разрешения..

вот еще:
провел эксперимент

Код: Выделить всё

<html>
<head>
   <title>Untitled</title>
   <style type="text/css">
DIV.clSlide{position: relative;  ;z-index:10; left:0; width:138; height:22; clip:rect(0,138,22,0); padding:3px;}
DIV.clSlideSub{position: relative; ;z-index:10; padding:2px; clip:rect(0,127,20,0); width:127; height:20; left:8;}
DIV.clSlideSub2{position: relative; ;z-index:10; padding:2px; clip:rect(0,118,20,0); width:118; height:20; left:8; }
#divSlideCont{position: relative; z-index:10; left:0; top:100; height:60; width:170; visibility:hidden}
A.clSlideLinks{font-family:Verdana, Helvetica, Helv; font-size:11px; font-weight:bold; text-decoration:none; color:white}
A.clSlideSubLinks{font-family:Verdana, Helvetica, Helv; font-size:10px; text-decoration:none; color:Navy}
A.clSlideSub2Links{font-family:Verdana, Helvetica, Helv; font-size:9px; text-decoration:none; color:Navy}
</style>

</head>

<body>

<div align="center">
<div class="clSlideSub">казя базя</div>
<div class="clSlideSub2">казя базя</div>
</div>



</body>
</html>

что собственно произошло: браузер послал нах координаты, поскольку position: relative, отсчитал центр и воткнул туда слои

вот еще
то что ты хочешь, но более корректно, без привязывания к слоям
_http://www.ultra-online.ru/cat.php?id=1

[zomzom]

Так что можно сделать не переписывая сам скрипт? И вообще можно как нибыдь жестко привязать контейнер со слоями в ячейку, к примеру к ее левой границе?

[Berezkin]

Зная id ячейки, можно скриптом найти ее положение на странице

Код: Выделить всё

function getCoords(obj) {
var coordX = 0, coordY = 0;
while (obj) {
coordX = obj.offsetLeft;
coordY = obj.offsetTop;
obj = obj.offsetParent;
}
}


где obj - id ячейки

[Hulio]

2zomzom:
как нибыдь жестко привязать контейнер со слоями в ячейку, к примеру к ее левой границе?
К левой - легко, position: absolute и указанием координат, к расположенной относительно центра - нужно дополнять скриптом считающим разрешение

[zomzom]

Это уже конкретный совет )). А этот скриптик не подскажешь где взять или как он выглядит?

Я так понял Что мне нужно будет просчитать положение меню при каждом разрешении, так чтоб оно попадало в нужную ячейку таблицы?

[Muerto]

Код: Выделить всё

var x;
if (self.innerWidth) {
x = self.innerWidth;
} else if (document.documentElement && document.documentElement.clientHeight) {
x = document.documentElement.clientWidth;
} else if (document.body) {
x = document.body.clientWidth;
}
alert ("Середина страницы по Х в точке " +  x/2 + "px");


Скрипт придётся вешать на onLoad и onResize у body.

[Alkeeper]

2Muerto: onresize - не поддерживается стандартами

[Muerto]

2Alkeeper: А какая альтернатива?

[Padonak]

window.onresize

[Muerto]

2Padonak: Те же яйца, вид сбоку. Я думал, за время моего запоя, какое новое событие ввели.

[Padonak]

2Muerto:

надо в W3C идею подкинуть что неплохо бы ввести такое событие как muerto.onzapoyend

[Muerto]

2Padonak: Мало использоваться будет, поскольку состояние перманетно.

[Alkeeper]

2Padonak: Мало использоваться будет, поскольку состояние перманетно.

И происходить должно по умолчанию

[zomzom]

Если честно - я долго искал аналогичное меню, но с возможностью размещения его в ячейки таблицы сцентрированной на экране (( нету! и в общем с явавскими менюшками проблема в отношении позиционирования. На одном из форумов советов было масса, но как правило даже я - человек понимающий в CSS и Jscripte совсем децл, осознавал бредовость половины этих советов, а когда предлогал финансовое поощрение за подгонку данного меню под мои требования и обьяснения того как это получилось, тема тут же затихала.

По прошествии полутора месяца, я понял что не так уж это и легко. И если вы подскажите где я могу таки найти нужное мне меню, буду очень признателен. Или кто возьмется собрать воедино данное меню и сцентрированную таблицу.

[Muerto]

Мне лень с самого начала читать топик мне лень, ссылки уже не работают. Выложи хоть скриншот того, что ты хочешь с ТЗ и посмотрим что можно сделать.

[zomzom]

http://packall.ru/menu-slide/001.htm - это выходит у меня, а вот оригинальный вид но под него нужно подгонять весь сайт http://packall.ru/menu-slide/index.html

[Lucia]

Честно сказать, не совсем поняла. Но, по всей видимости, надо оставить рабочий вариант с position: absolute и всем блокам просто скриптом изменить left при загрузке. Позицию можно расчитать от шапки offsetLeft (правда это свойство не в DOMe). Или математически, используя скрипт Muerto.