#8756 closed feature (fixed)
Resizable: Complex markup for handles
Reported by: | MatteS75 | Owned by: | MatteS75 |
---|---|---|---|
Priority: | minor | Milestone: | 1.10.0 |
Component: | ui.resizable | Version: | 1.9.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Creating a handle with an inner element renders the resize handle useless.
- Create a resizable div with an inner div with the handle classes setup
- Add another div inside the handle div
- Initialize the resizable
Now the resizable handle does not work. Removing the inner div, and it does work.
jsFiddle: http://jsfiddle.net/MatteS75/3dwVp/15/
Change History (13)
comment:2 follow-up: 3 Changed 10 years ago by
Milestone: | 1.10.0 → 2.0.0 |
---|---|
Owner: | set to MatteS75 |
Status: | new → pending |
Summary: | Resizable handle with inner element does not work → Resizable: Complex markup for handles |
Type: | bug → feature |
What is your use case that makes this necessary?
comment:3 Changed 10 years ago by
Status: | pending → new |
---|
Replying to scott.gonzalez:
What is your use case that makes this necessary?
For me, I need it to style the handle. I know its not always the best solution to add divs just for styling, but in this case I need to make a css based triangle using the common css trick: http://css-tricks.com/snippets/css/css-triangle/
I have fixed the problem in our jquery ui code directly, but would rather this worked out of the box ofcourse.
I could help fix it, but im a bit new to contributing to js oss projects. I guess ill have to dive into the jquery ui code with tests and all if so.
Anyway, my fix looks like this:
_mouseCapture: function(event) { var handle = false; for (var i in this.handles) { - if ($(this.handles[i])[0] == event.target) { + if ($(this.handles[i])[0] == event.target || $(this.handles[i]).has(event.target)) { handle = true; } }
comment:4 follow-up: 5 Changed 10 years ago by
Status: | new → pending |
---|
You can build any CSS design using a single element, so I don't see why you need nested elements for this: http://jsfiddle.net/3dwVp/17/
comment:5 Changed 10 years ago by
Status: | pending → new |
---|
Replying to scott.gonzalez:
You can build any CSS design using a single element, so I don't see why you need nested elements for this: http://jsfiddle.net/3dwVp/17/
Yes, for a single element that is nice.
However, our design requires something like this: http://jsfiddle.net/3dwVp/18/ If I can make it like that without an inner div itd make my day.
comment:6 Changed 10 years ago by
By the way, I have forked the repo and am investigating how to best write tests for this at this point.
comment:7 Changed 10 years ago by
Ok, I think I got it working, and the fix was a little different and better than my first suggestion I think. Here is the pull request:
comment:8 Changed 10 years ago by
If this pull request is accepted, id gladly fix http://bugs.jqueryui.com/ticket/8757 aswell. Or repost a new ticket, if that thing still fails that is.
comment:9 Changed 10 years ago by
A new pull request. I made a branching mistake with the first one. As said, im new to this =)
comment:10 Changed 10 years ago by
Status: | new → open |
---|
comment:11 Changed 10 years ago by
Resolution: | → fixed |
---|---|
Status: | open → closed |
Resizable: Made handles work with complex markup. Fixes #8756 - Resizable: Complex markup for handles.
Changeset: 0bff32a2b1c2273e46dc0f70bc1058ad304ebcc5
comment:12 Changed 10 years ago by
Milestone: | 2.0.0 → 1.10.0 |
---|
Possible workaround: