Как вычислить размер блока?

[WalkMan]

дано:

хтмл

<div class="visArea" style="width: 185px; height: 300px; ">
		 <div class="scrollArea" style="width: ???; height: 280px; ">
				<p></p>
				<p></p>
		 </div>
</div>

цсс

.visArea { position: relative; overflow: hidden; }
.scrollArea { position: absolute; top: 0px; left: 0px; }

есть блок фикс размера

в нем имееться блок с контентом у которого известна одна сторона(в данном случае высота)

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

[klierik]

а просто width: 100%; не подходит?

[psywalker]

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

[sigma77]

Можно еще свойство right: 0 добавить.

Только зачем там абсолют мне в принципе не понятно...

[mishka]

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

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

[WalkMan]

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

ничиво создавать не надо)

все уже есть

вариант по кланированию имхо не очень, так как надо лишний раз дом дергать

тут обратили внимание на позишн абсолют

вроде работает

но пока не проверял точность вычислений

сигма спасибо)

[psywalker]

ничиво создавать не надо)

все уже есть

вариант по кланированию имхо не очень, так как надо лишний раз дом дергать

тут обратили внимание на позишн абсолют

вроде работает

но пока не проверял точность вычислений

сигма спасибо)

Дружище, если не сложно. Сделай потом тестовую страничку с этим отдельным примером.

[WalkMan]

потестил

особо не хочет

можно по идее применить арифметику

но должно быть решение проще и лучше

суть такая

это часть скрипта скрола

цель внутренний контент ужать по ширине или длинне(зависит от варианта скрола)

ну и остаток этого всего вытянуть в нужную сторону что бы все вместилось

с вертикальным скролом и обсчетом соответсвенно высоты контейнера проблем не испытал

а вот с обсчетом ширины при горизонтальном скролле чтото не могу справиться

как вариант после вычисления высоты чекать её суммой высот внутренних элементов, но опять получаеться какаято делта результата

но что с этой дельтой делать хз

[psywalker]

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

[WalkMan]

суть в чем

серый блок это видимая область

есть у нас какойто контент и занимает он весь синий блок

задача видоизменить синий блок до красного как показано на примере что бы он хорошо вошел в серый)

в данной пиксе эта трансформация для горизонтального скрола

если не понятно, как подругому изъяснить свою мысль я хз))

[sigma77]

задача видоизменить синий блок до красного как показано на примере что бы он хорошо вошел в серый)

Вот эта фраза просто убила

overflow: auto ... не?

[Great Rash]

Я так понимаю проблема в следующем: надо запихнуть синий блок в серый, так чтоб он стал по размерам как красный.

Я прав?

Вопрос - зачем? Представьте себе работу обычного скроллбара. Скроллбар не видоизменяет блоки, он просто проскролливает содержимое, которое не влазит в блок.

Ну да ладно, допустим вы меня не послкшали и решили все-таки замутить свою идею

Нам на помощь приходит геометрия. Что такое блок? Правильно, это прямоугольник. Значит мы можем высчитать его площадь.

Площадь прямоугольника равна width * height.

Мы знаем, что независимо от того какая у нас будет высота, площадь должна оставаться одинаковой.

Высота и площадь нам известны, значит чтобы найти ширину, нам надо просто разделить площадь на высоту.

Допустим мы имеем див с размерами 800х600 пикселей, тогда алгоритм действий такой:

1) узнаём площадь синего дива: 800 * 600 = 480000

2) уменьшаем его высоту, допустим, до 100 пикселей

3) площадь и высоту мы знаем, значит ширина будет равна: 480000 / 100 = 4800 пикселей

4) ?????

5) PROFIT!!!

P.S. Геометрия 7 класс

P.P.S. psywalker, учи геометрию

P.P.P.S. WalkMan тоже

[WalkMan]

Я так понимаю проблема в следующем: надо запихнуть синий блок в серый, так чтоб он стал по размерам как красный.

Я прав?

Вопрос - зачем? Представьте себе работу обычного скроллбара. Скроллбар не видоизменяет блоки, он просто проскролливает содержимое, которое не влазит в блок.

Ну да ладно, допустим вы меня не послкшали и решили все-таки замутить свою идею

Нам на помощь приходит геометрия. Что такое блок? Правильно, это прямоугольник. Значит мы можем высчитать его площадь.

Площадь прямоугольника равна width * height.

Мы знаем, что независимо от того какая у нас будет высота, площадь должна оставаться одинаковой.

Высота и площадь нам известны, значит чтобы найти ширину, нам надо просто разделить площадь на высоту.

Допустим мы имеем див с размерами 800х600 пикселей, тогда алгоритм действий такой:

1) узнаём площадь синего дива: 800 * 600 = 480000

2) уменьшаем его высоту, допустим, до 100 пикселей

3) площадь и высоту мы знаем, значит ширина будет равна: 480000 / 100 = 4800 пикселей

4) ?????

5) PROFIT!!!

P.S. Геометрия 7 класс

P.P.S. psywalker, учи геометрию

P.P.P.S. WalkMan тоже

донес идею правильно)

по работе скролбара не совсем понятно

как сделать алгоритм для горизонтальной прокрутки

по геометри это бы мой первый способ который я придумал но он не совершен

большие погрешности в расчетах

Edited February 14, 2011 by WalkMan

[Great Rash]

по работе скролбара не совсем понятно

как сделать алгоритм для горизонтальной прокрутки

Что не понятно?

по геометри это бы мой первый способ который я придумал но он не совершен

большие погрешности в расчетах

Не верю, какие могут быть погрешности? Да JS считает с погрешностью, но это 0,9 максимум.

[WalkMan]

Что не понятно?

Не верю, какие могут быть погрешности? Да JS считает с погрешностью, но это 0,9 максимум.

непонятно как реализовать горизонтадбную прокрутку- иматацию скрола

есть контент

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

по погрешности

если работать с текстом то вариант с математикой не прокатит

у меня не прокатило)

погрешности гдето в 20 и больше пикселей

[Great Rash]

есть контент

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

Так, советую вам создать блок с ovrflow: auto; и внимательно посмотреть как он работает. Потом, изучив поведение, реализовать свой скролл. Обратите внимание, что ничего нигде не ужимается.

по погрешности

если работать с текстом то вариант с математикой не прокатит

у меня не прокатило)

погрешности гдето в 20 и больше пикселей

Наверное это не удивительно, т.к. не факт, что 3 строки текста займут такую же площадь если их вытянуть в одну строку. Расстояния между словами неравны расстоянию между строками...