I have applied lockToContainerEdges={true} and lockOffset="0%" to my SortableList from react-sortable-hoc. There is a weird interaction, the dragged element stays in position and the one in the position you drag it disappears. if I unset those values and lock the y axis it works fine, it's just when I lock the elements to containers. Any ideas how to fix that?
Related
I've used #angular/cdk/drag-drop library to implement a drag and drop functionality. It works well, however when dragging an element, the layout of dragged item (div containing mat-angular dropdowns, delete icon and drag handle) breaks.
As soon as I place the item it is back in place looking as it should (img 1), but it looks like during dragging the item loses its parent div, therefore it is not inline, as well as not retaining the same dimensions (img 2)
This is how it looks before dragging
This is how it looks during dragging
I've attempted to solve this with adding a class with required width and height + set its display property to inline flex, however it does not help.
I have one issue for iOS device when i focus on input cursor of input does not stay fix it scrolls with page scroll.
Added one solution for cursor issue but its behaviour is like when scroll page by dragging cursor moves and take it position again this small issue occurs other wise scrolling cursor is solved just need to check for another issue
First solution is give -webkit-overflow-scrolling: auto to scroll-content div but when its applying it cause hard scrolling
Second solution is disablescroll(true) to page but it gives current behaviour that is cursor moves and then get its position
Need better solution for this issue.
I would like to place the child actor at an initial position within the ScrollPane, but the scrollTo() method seems to only do a scroll animation, and doesn't allow to move the child actor instantly. Using the child actor's setPosition() has no effect too.
call updateVisualScroll() after programmatically updating the scroll position
I am trying to make a pop-up on certain elements where the <div>'s initial position is based on the mouse position. I already know how to get the <div> to appear in the same place each time but I want it to be relative to the mouse's position when it first appears. I don't want the <div> to move after it appears. Is this possible to do without using any JavaScript at all (i.e. CSS only)? If so, how please!
I do not think what you are asking is possible. The logical conclusion would be that you need a third party to retrieve the mouse position and then insert the desired element.
I have a movieclip with the mesurements of a rectangle. When the application is launched the movieclip is being scaled before placed on the stage as following.
menu.width = 400;
menu.scaleY = menu.scaleX;
this is a smaller size than the original.
the position of the movieclip at this moment is in the middle on the x and top of the stage on the y.
when i click iti would like to do a tween with tweenlite wich scales it to its original(bigger) width and height and position it in the center of the stage on x and y.
the problem is when i position it with tweenlite, it gets done according to its old scale and not according to its new(bigger) scale so the movieclip isnt placed in the exact center of the stage.
Anyone know how i can resolve this?
I tried to compensate by adding a bigger number on the position so it gets positioned in the right way.
But when i click it again i would like it to rescale to its beginning scale and position so it would be very messy to compensate again. Is there any easier way to do this kind of tween?
I doubt that i'm being clear to what i want but i hope i am after all.
The easy and way of tween position and scale is probably to add the menu to a container.
You would then on one hand tween the position of the container, and on the other apply the scale to the menu it self without having to recalculate the proportional position if the scale changes.
This way you can even control the registration point of the menu within the container. e.g. to always scale from the middle...
This can be done with a matrix as well if you want to avoid to stack objects, but honestly it can get really tricky whereas the container method is bullet-proof.