Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Растягивание структуры фреймов за картинку

Автор: godsgame 12.8.2006, 14:06

Есть фреймовая структура, т.е, предположим, что станица разделена на 3 фрейма горизонтально!
в одном из фреймов, пусть будет тот который по середине - находится картинка.
Можно ли сделать такое:
Нажимаешь левую кнопку мыши на этой картинке, и удерживая ее (кн. мыши) тянешь мышь вверх/низ - при этом меняются размеры фреймов! (всех кроме того где эта линия!)
Если например потянул мышь наверх на 100 пикселей и отпустил, то получается верхний фрейм стал меньше (height) на 100 пикселей, а нижний на 100 больше! (центральный фрейм остался без изменений!

возможно такое сделать?

Автор: vasac 12.8.2006, 16:27

Лови нажатие кнопки мыши над картинкой — записывай координаты.
Лови отпускание кнопки — считай разность координат, производи нужные манипуляции.

Если хочешь, чтобы в момент самого перетаскивания что-то происходило — лови onMouseMove, но там будет чуть сложнее, так как обработчики могут не успевать обрабатывать каждый шаг мыши.

Автор: 12345c 12.8.2006, 20:00

Что-то такое:

Код

<frameset name=fs1 frameborder=1 framespacing=0 rows=200,100,*>
  <frame name=fr1></frame>
  <frame name=fr2 src=JsPrimeryCode-94a.htm></frame>
  <frame name=fr3></frame>
</frameset>

Файл JsPrimeryCode-94a.htm:

Код

<script>Down=0;r1=200;var cY;
(d=document).onmousedown=function(ev){Down=1;
  cY=(d.all?event:ev).clientY;
  //top.document.getElementsByName('fs1')[0].rows="200,100,*";
  }
d.onmousemove=function(ev){if(Down){
  r1-=cY-(d.all?event:ev).clientY;
  top.document.getElementsByName('fs1')[0].rows=r1+",100,*";
}}
d.onmouseup=function(){Down=0;}
</script>
Хватаем за любую точку этого фрейма и таскаем вверх-вниз.
(Кроме Оперы.)

Демо здесь: http://js2.ru/example/JsPrimeryCode-94.htm .
Инфо: http://js2.ru/files/js/FRAMESET.html .

Автор: godsgame 15.8.2006, 18:02

vasac,
я примерно так и думал но с реализацией затруднялся.. знаний малова-то

12345c,
спасибо! все работает!