Как написать Jquery скрипт перемещения внутри блока?

Question

[Себастьян Перейра]

Здравствуйте.
Помогите реализовать скрипт.

Есть наработка
jsfiddle.net/LudcM

При нажатии на место страницы, блок перемещается на координаты клика.
"Допилить" нужно, чтобы это действовало только внутри блока "borderbl"
Если я нажимаю внутри него, то объект перемещается и не вылезает за рамки (прижимается к ним, не хочу overflow: hidden), если вне - не реагирует.

Спасибо

Answer 1

[Юрий Лобанов]

jsfiddle.net/iiil/LudcM/9
Вы внимательно посмотрите, там координаты не совсем верно определяются, наверное по середине курсора, потому надо ввести поправку в несколько пикселей. Если не разберетесь - пишите.

Comments

[Юрий Лобанов]

а так сделал все что хотели )

[Себастьян Перейра]

От души вам, спасибо!

[Юрий Лобанов]

@uJlJluduAH еще вариант с поправкой посмотрите, правда я только в ff смотрел, проверьте в других браузерах.

Answer 2

[Юрий Лобанов]

jsfiddle.net/iiil/LudcM/16
Вот с поправкой

Answer 3

[5nook]

jsfiddle.net/LudcM/1

ну я вот тут буквально чуток сделал, теперь клик действует только внутри блока borderbl

как я понимаю вам еще надо чтобы блок не выходил вне блока родителя

Comments

[Себастьян Перейра]

Да, это почти то что нужно. Спасибо!

[5nook]

jsfiddle.net/LudcM/15

вот еще один пример :) хотя вам помогли уже

[5nook]

так сказать тот пример более совершенен :) но одно и тоже по сути

[Юрий Лобанов]

@5nook prntscr.com/2umko8
не работает. Если нажать на край блока - он вон куда убегает.

[5nook]

работает :) видимо я забыл обновить скрипт jsfiddle.net/LudcM/17
вот все работает

[Юрий Лобанов]

@5nook вот это условие:
e.pageX <= 300 - выполняется всегда при клике на зеленый блок
e.pageX >= 300 - а вот это только при клике на самый край блока (т.е. ровно 300), и вы ему даете позицию аж 300+110, вот он и убегает.
Это во-первых, а во-вторых, Вы ширину маленького блока не учли. Так что без обид, но это по сути разные вещи :)

[Юрий Лобанов]

@5nook да, видимо. Но значение 151 и 150 надо определять, чтобы при смене css не надо было переписывать скрипт. и посмотрите конструкцию if else, зачем Вы двойное условие записываете?

[5nook]

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