Edit Question - KnowledgeHub

Title Body

OK, here is my question. Using jQuery UI position. It is possible to position an element in relation to another element on the screen. It sets the left and top css properties on the element being positioned which positions it on the screen. What I want to do is instead of setting the left and top, I want to possibly set right and bottom instead so that if the positioned element grows or shrinks, it will grow / shrink in the correct direction. Let me go into details. Ok, what I want is if an element is positioned on it's right, then I want to set the right css property instead of the left and if an element is positioned on its bottom, then I want to set bottom instead of top . I can do this using the using property of jQuery UI Position, but I run into problems with collision detection. If collision detection is set to flip and the element gets flipped, I want to detect this and figure out whether I need to set right instead of left and bottom instead of top . Check out the code below to get a better idea of what I'm trying to do. $('#somediv').position({ my: 'right bottom', at: 'right top', of: $('#someotherdiv'), offset: '0 5', collision: 'flip flip', using: function(pos) { // Figure out the right and bottom css properties var right = $(window).width() - pos.left - $(this).outerWidth(true); var bottom = $(window).height() - pos.top - $(this).outerHeight(true); // Position the element so that right and bottom are set. $(this).css({left: '', right: right, top: '', bottom: bottom}); } }); That works great, except when the div gets flipped from collision detection. If it gets flipped horizontally, I want to set left instead of right and if it gets flipped vertically I want to set top instead

Tags (comma-separated) Cancel