Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: задать/узнать высоту, ширину скрытого блока?
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » задать/узнать высоту, ширину скрытого блока?

Страниц (1): [1]
 

1. exlant - 10 Марта, 2015 - 15:49:47 - перейти к сообщению
Есть скрытый див блок(display: none, visibility:hidden не подходит), по событию вывожу его на экран, анимацию делаю по типу
CODE (javascript):
скопировать код в буфер обмена
  1.  
  2.          this.start = function(){
  3.             func = this[func];
  4.             timer = setInterval(function(){
  5.                 func();
  6.             } ,interval);
  7.            
  8.         };
  9.        
  10.         this.openBlock = function(){
  11.             if(width < setWidth){
  12.                 width += this.stepW;
  13.             }else{
  14.                 width = setWidth;
  15.             }
  16.             if(height < setHeight){
  17.                 height += this.stepH;
  18.             }else{
  19.                 height = setHeight;
  20.             }
  21.             if(opacity <= 1){
  22.                 opacity += this.stepO;              
  23.             }
  24.            
  25.             element.style.width = width+"px";
  26.             element.style.height = height+"px";
  27.             element.style.opacity = opacity;
  28.             if(width >= setWidth && height >= setHeight && opacity >= 1){
  29.                     clearInterval(timer);
  30.                     if(addToEndInterval)
  31.                        addToEndInterval();
  32.             }
  33.         }.bind(this);
  34.  

setWidth, setHeight - это окончательные ширина и высота див блока, и их приходится задавать в ручную!
содержимое див блока может меняться, как динамически узнать/задать исходную ширину и/или высоту блока?

искал в нете, нашел как вариант прятать div блок по типу
CODE (html):
скопировать код в буфер обмена
  1.  
  2. div{
  3. position:fixed;
  4. margin-left: -100px;
  5. }
  6.  

такой вариант не подходит!

P.S. jQuery, или другие фреймворки не предлагать, учусь именно яваскрипту!
2. esterio - 10 Марта, 2015 - 16:06:29 - перейти к сообщению
получить размер елемента при display:none никак не получиться, только скрывать с помощью JS перед этим сохранив размер
(Добавление)
есть еще такой вариант
http://jsfiddle[dot]net/Lhb2tn79/
но он будет работать только если явно задать в стилях размер
3. exlant - 10 Марта, 2015 - 16:13:53 - перейти к сообщению
меня больше интересует задать хотя бы приблизительно именно height

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

Или может еще какие то варианты есть? Неужели никто с таким не сталкивался?
(Добавление)
Цитата:
есть еще такой вариант
http://jsfiddle[dot]net/Lhb2tn79/
но он будет работать только если явно задать в стилях размер

такой тоже не подходит..
4. esterio - 10 Марта, 2015 - 16:16:49 - перейти к сообщению
проще уже показать сам елемент, узнать висоту и снова скрыть. чтобы посчитать количество строк нужно учитивать перенос строк, интервал, шрифт и много еще чего
5. DelphinPRO - 10 Марта, 2015 - 17:43:52 - перейти к сообщению
подсчет строк - фигня.

вариант вижу только один, озвученный esterio -
display:block
visibility: hidden;
или
opacity: 0;
таким образом мы можем узнать у блока размеры.
затем выставляем стартовые значения и начинаем анимацию.
Все это делаем скриптом, для глаза будет незаметно.
6. exlant - 10 Марта, 2015 - 17:48:21 - перейти к сообщению
ясно..

Всем спасибо! Буду думать в направлении показывать блок!

 

Powered by ExBB FM 1.0 RC1