понравился ползунок здесь, который форму расширяет, а т.к. недолюбливаю библиотеки, написал своё:


не так уж и сложно оказалось. 

однако, возник вопрос. вот эта переменная в коде dropNS явно лишняя, если бы работали методы removeEventListener и detachEvent. но они не работают. (если убрать переменную, то листенеры останутся)

здесь проблема так и не решена. ведь обработчики не явные, должны же они как-то сниматься.

bars80080, а почему так не сделатьИли я что-то не так понял?

так, не работает так

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

Добавлено через 11 минут и 7 секунд
Ну вот в примере всё работает

ну, пример, примеру рознь. 

хендлеры навешиваются автоматом и именно через addListener и attachEvent, т.к. нужно событие event, а прописать в разметке заранее нельзя, они навешиваются потом

то бишь разделяем html и js

bars80080, на счёт навешивания вышеозначенными методами не знаю, надо пробовать, но в моём примере если ты обратил внимание, первой кнопке обработчик приписывается в html-коде, а второй из скрипта. И кстати в в лисе в осле работает один и тот же код.

Добавлено через 31 секунду
На 13-ю строку обрати внимание.

bars80080, это бесполезно, ИМХО. Вот таким вот образом:

вы не воспроизведете те «явные» (анонимные) обработчики, которые передали в метод addEventListener. Здесь это уже совершенно другие функции, не имеющие отношения к ранее зарегистрированным слушателям. Поэтому метод removeEventListener не дает эффекта — ему передали функцию, не являющуюся зарегистрированным слушателем.

Если вы не рассматриваете вариант с передачей функции в метод addEventListener «неявно», т.е. по ссылке на полноценную ранее подготовленную функцию-слушатель, то есть компромиссный вариант (но мне он не нравится):


где f1 и f2 — глобальные переменные.

P.S. Хотя, я думаю, лучше всего было бы не поскупиться и создать отдельную именованную функцию-слушатель и оперировать ею, а не анонимными функциями.

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





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

нормальный вариант. покатит

Как обойтись без глобальных переменных, сразу не соображу, но, с другой стороны, их и не будет много. Только две (пользователь не может таскать сразу две textarea) Первая глобальная переменная — id объекта textarea, размеры которого меняются (если имеется несколько таких textarea), второй — координаты, где изначально была нажата кнопка мыши. И всё — не так уж и много, вроде. А если textarea одна, то и вообще остается только одна глобальная переменная (dc).

в общем, как всегда большое спасибо

Это сообщение отредактировал(а) bars80080 - 14.12.2009, 17:42

Вот всё-таки есть у меня ощущение, что или я чего-то не догнал, или меня не поняли. Прочитал внимательнее первый пост и код...вот вариант, о котором говорил я

фиг знает, в последний раз у меня почему-то неудавалось передать event через такую запись

        body.onmousemove= function(e){ dropENS(bk[0].id, e, dc) }

из-за этого и приходилось всякие addEventListener вешать

Ну ты же знаешь как это бывает: где-нибудь запятую потерял или ещё что и кирдык. С яваскриптом это "как два пальца обоссать".

нет, там именно не получалось передать событие

вот, эта тема http://forum.vingrad.ru/index.php?showtopi...t&p=2020891

Хотелось бы увидеть код в контексте, чтобы попробовать в деле и что получится когда немного подправишь. Кое-что смущает(например this во вложенных функциях и многократная инициализация обработчиков, я просто не вкурсе как это js работает), но из того, что сразу бросается в глаза в этом кодея бы выделил вот такой момент
На сколько я понял из дальнейшего ell - это коллекция элементов, а не число, поэтому надо было писать вместо  i < ell всё-таки  i < ell.length. Ну это к вопросу о "запятых".

Это сообщение отредактировал(а) diadiavova - 15.12.2009, 00:32

ИМХО

Точно...пропёрся  

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

Это сообщение отредактировал(а) diadiavova - 15.12.2009, 01:37

мда, эта заморочка работает как надо.

будем иметь ввиду

вот конкретный локализованный пример:

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

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

Вот мне интересен другой вопрос(просто не в курсе как это в яваскрипте работает): когда ты в цикле объявляешь функцию это память не перегружает? Ведь по идее вот при вот таком коденовая функция создаётся при каждой итерации цикла. При чём эти все функции одинаковые. Мне почему-то кажется, что такой кодбудет работать более экономично по отношению к ресурсам. Или я чего-то не понимаю?

Это сообщение отредактировал(а) diadiavova - 15.12.2009, 16:36

Дак это ж совсем разные случаи.

В первом случае:

каждый раз в цикле создается индивидуальная функция и присваивается атрибуту meth элемента массива ar.

Во втором случае:

атрибуты math всех элементов массива ar указывают на одну и ту же единственную функцию myFunc.

Разумеется, второй вариант рациональнее.

-------------------------------------------------

И вообще, для наглядности сказанного выше кусочек демонстрационного кода  

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

согласен, уберу. но как тогда в неё засунуть эти параметры (event и this)?


как с mouseover поступить?

Ну event точно так же через параметр, а что до ссылки на элемент, то функцию ты в принципе можешь вывести в глобальную область и тогда слово this будет возвращать ссылку на объект.

Добавлено через 4 минуты и 54 секунды
А кроме того, объект события имеет ссылку на отправителя этого события. В ИЕ это свойство srcElement, а в файрфоксе точно не помню, кажется targetObject

образовалась новая проблема по этому вопросу

вот мы всё время говорили о textarea, но тут чёрт дёрнул меня подключить fckeditor. как знаете, эта штуковина заменяет текстарею на скрытое поле и фрейм. конечно, такой ползунок для такого эдитора ещё более полезен, но тут возникла естественная проблема - как только курсор оказывается над фреймом, то обработчик document.body.onmousemove конечно перестаёт действовать, ведь это не его документ

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

вооот, что хотел спросить: нет ли какого обходника простого или всё же придётся мучаться с линковкой?

Нет, я не в курсе. Но не вижу проблемы с обработкой событий фрейма, если он в том же домене, что и основной документ. Всё можно делать в одном документе, просто перенести в него все необходимые ссылки. Вот пример документа
А вот его фрейм
EditFrame.htm
Вся обработка производится в самом документе, просто в него надо добавить ссылки на нужные элементы фрейма.

так, я снова вернулся к этому вопросу.

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

код такой:

в ИЕ7 работает отлично, в ФФ, опере и хроме проявляется странный эффект. слой не реагирует на изменение marginTop, но при этом, если назначить слою бордюр (тот закомментированный стиль), то работает нормально во всех браузерах.

какой-то тотальный дефект мозиллы или гекко, кто там у них в основе.
как бы с ним справится, чтоб без бордюра работало?

По очереди.
Тема интересная, но есть общие замечания в порядке критики.
Такой метод, конечно, удобен, как и аналог его, зашитый в браузер Safari3+ (активная область перетаскивания внизу справа). Но лучше, если бы его вообще не было. Т.е. реализовать автоматическое расширение textarea, как сделано в 
http://www.google.com/search?client=opera&...o-Grow+Textarea :
http://habrahabr.ru/blogs/habrahabr_ideas/11064/
http://habrahabr.ru/blogs/habrahabr_ideas/11064/
Общая проблема в реализации в том, что в Опере не хватает информации о содержимом (не возвращается высота текста), поэтому для полной кроссбраузерности требуется громоздкое решение с эмуляцией текстареи в невидимом Div. 

Если при этом надо ограничить максимальную высоту, вводим ещё один параметр максимальной высоты. Тогда и понадобится визуальная область перетаскивания. Тронули её - высота фиксируется.

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

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


По приведённому коду - что-то во всех этих примерах очень много лишнего. Уйти от глобальных переменных - как известно, это значит использовать замыкания. Или, как вариант, записать обработчик в оперируемый DOM-объект div class="area". Но на самом деле, хранить функцию в объекте не нужно, потому что курсор мыши всегда один . Как появится mouseup, так удаляем тот единственный  Listener("mousemove"), которому ничего не мешает быть единственным глобальным.

Есть баг в IE6 - не установлен .area div(font-size:4px} или сколько надо.
...
Этот последний метод с закрылками должен тоже нормально работать (только поставить прозрачный рисунок вместо заливки).

бляха-муха. я собсна и хотел, но вначале проверил на заливке, а он с ней почему-то портачит. неужели, опять не дотянул?

завтра попробую

нет, не пашет. ФФ просто игнорирует, если не указан бордюр. 

маразм какой-то

Добавлено через 8 минут и 56 секунд


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

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


работает в ИЕ6, ИЕ7, ИЕ8, опера 9.5, ФФ3, ГуглХром

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

Видимо, это схлопывание маргинов. А в IE<8 ошибка, что все относительно позиционированные элементы создают новый контекст форматирования (а должны только с явно заданным z-index'ом). А просто top-ом/left-ом (раз элемент относительно позиционируется) двигать нельзя?

Тогда, как предлагал, 
Т.е. вместе с авто-grow можно зафиксировать область, двинув ползунок 1 раз (как в Экселе ячейка).

Простите, а Вы с какой планетЫ?  

не понял, а чем это отличается от моего?
или я не догнал как



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

В плане ползунка - авто-grow текстареи, если его не трогаешь.

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