- This topic is empty.
March 13, 2014 at 3:59 pm #165723AnonymousInactive
I want to toggle a div from its original position to the left and back again. I don’t want to use toggleClass because the amount it will move is based on the value of a variable. I tried jqueryUI slide() but that hides the element afterwards. This is exactly what i want to do but without using toggleClass, also a slide animation would be nice. http://codepen.io/anon/pen/noapiMarch 13, 2014 at 4:23 pm #165725March 13, 2014 at 4:25 pm #165726AnonymousInactive
Thanks but this isnt what im looking for. I need the element to move back to its original position when clicked again, Not continue.March 13, 2014 at 8:41 pm #165738AnonymousInactive
I didn’t think such a simple and obvious effect wouldn’t be implemented into jQuery UI.March 14, 2014 at 3:34 am #165758
I don’t want to use toggleClass because the amount it will move is based on the value of a variable
What variable?March 14, 2014 at 6:28 am #165766Alan CParticipant
Modified the above JS slightly to make it go back. Does this help?March 14, 2014 at 10:28 am #165808
Yeah…but the issue is separating the two events into 2 functions based on clicking the object twice.
We used to be able to do this with
.togglebut that’s be deprecated by JQuery.
Obvioulsy the quick answer would be to
.toggleClassbut, apparently we can’t use that because the offset amount is a variable.
Frankly, I’d like to see what the actual use case is because it’s not clear to me why a variable is required.March 14, 2014 at 11:18 am #165814AnonymousInactive
The element will move back and forth based on the width of the sidebar so it can reveal it. If the user were to change the sidebar width, the element that reveals and hides the sidebar will need to move back as much as the width so it can reveal it and hide it as well. the value of the variable that gets the sidebar width will also be the value for the element that reveals it. So the element will move back 500px if the sidebar is 500px wide, and it will move back 500px to hide it. and i need the variable because the user might want to change the width. the element moves back as much as the user changed the sidebar width.March 14, 2014 at 11:55 am #165822
How would a user change the width of the sidebar?
Do you mean the sidebar is responsive?March 17, 2014 at 11:18 am #166062Alan CParticipant
Maybe you could grab the container’s size when the user gives the command for it to retract? I just spent some time playing with it and it becomes convoluted after a little while.
Especially after the animation has happened and you have no way of getting your element back without either leaving a trace of it behind that doesn’t allow propagation or an external button/element with another function on it.
Super far from perfect but here is an idea of what I mean: