r2853 - + Multiple elements should now be individually positioned properly.
Author: vtGavin
Date: Tue Jun 30 05:50:57 2009
New Revision: 2853
Modified:
branches/dev/positionTo/demos/positionTo/default.html
branches/dev/positionTo/ui/ui.positionTo.js
Log:
+ Multiple elements should now be individually positioned properly.
Modified: branches/dev/positionTo/demos/positionTo/default.html
==============================================================================
--- branches/dev/positionTo/demos/positionTo/default.html (original)
+++ branches/dev/positionTo/demos/positionTo/default.html Tue Jun 30
05:50:57 2009
@@ -20,7 +20,7 @@
text-align: center;
}
- div#positionTo_positionable
+ div.positionTo_positionable
{
width: 75px;
height: 75px;
@@ -49,7 +49,7 @@
$('select#positionTo_targetAnchor_horizontal
option:selected').val() + ' '
+ $('select#positionTo_targetAnchor_vertical
option:selected').val();
- $('div#positionTo_positionable').positionTo({
+ $('div.positionTo_positionable').positionTo({
of: $('div#positionTo_parent')[0],
my: positionableAnchor,
at: targetAnchor,
@@ -70,9 +70,15 @@
</div>
-<div id="positionTo_positionable">
+<div class="positionTo_positionable">
to position
+
+</div>
+
+<div class="positionTo_positionable" style="right: 100px;">
+
+ to position 2
</div>
Modified: branches/dev/positionTo/ui/ui.positionTo.js
==============================================================================
--- branches/dev/positionTo/ui/ui.positionTo.js (original)
+++ branches/dev/positionTo/ui/ui.positionTo.js Tue Jun 30 05:50:57 2009
@@ -16,6 +16,7 @@
at: 'left bottom',
offset: '0 0',
collisionDetect: 'flip',
+ by: false,
stackFix: true
}, options);
@@ -25,101 +26,103 @@
targetPosition.right = targetPosition.left + $targetElem.outerWidth();
targetPosition.bottom = targetPosition.top + $targetElem.outerHeight();
- var positionableOffset_x = 0,
- positionableOffset_y = 0,
- array_positionableAnchor_chunks = options.my.split(' '),
+ var array_positionableAnchor_chunks = options.my.split(' '),
array_targetAnchor_chunks = options.at.split(' '),
array_offset_chunks = options.offset.replace(/px/gi, '').split(' ');
-
- if (array_positionableAnchor_chunks.length == 2)
- {
- // now, figure out the horizontal positionable offset
- switch (array_positionableAnchor_chunks[0])
- {
- case 'center':
- positionableOffset_x -= (this.outerWidth() / 2);
- break;
-
- case 'right':
- positionableOffset_x -= this.outerWidth();
- break;
- }
-
- // figure out the vertical positionable offset
- switch(array_positionableAnchor_chunks[1])
- {
- case 'middle':
- positionableOffset_y -= (this.outerHeight() / 2);
- break;
-
- case 'bottom':
- positionableOffset_y -= this.outerHeight();
- break;
- }
- }
-
- if (array_targetAnchor_chunks.length == 2)
- {
- // figure out the horizontal target offset
- switch (array_targetAnchor_chunks[0])
- {
- case 'center':
- positionableOffset_x += (targetPosition.right - targetPosition.left) /
2;
- break;
-
- case 'right':
- positionableOffset_x += (targetPosition.right - targetPosition.left);
- break;
- }
-
- // figure out the vertical target offset
- switch (array_targetAnchor_chunks[1])
- {
- case 'middle':
- positionableOffset_y += (targetPosition.bottom - targetPosition.top) /
2;
- break;
-
- case 'bottom':
- positionableOffset_y += (targetPosition.bottom - targetPosition.top);
- break;
- }
- }
-
- if (array_offset_chunks.length == 2)
- {
- var offset_horizontal_px = parseInt(array_offset_chunks[0]);
- // if: a valid integer was specified for the horizontal offset
- // then: apply it to the calculated horizontal offset
- if (!isNaN(offset_horizontal_px))
+
+ return this.each(function(){
+ var $elem = $(this),
+ positionableOffset_x = 0,
+ positionableOffset_y = 0;
+
+ if (array_positionableAnchor_chunks.length == 2)
{
- positionableOffset_x += offset_horizontal_px;
+ // now, figure out the horizontal positionable offset
+ switch (array_positionableAnchor_chunks[0])
+ {
+ case 'center':
+ positionableOffset_x -= ($elem.outerWidth() / 2);
+ break;
+
+ case 'right':
+ positionableOffset_x -= $elem.outerWidth();
+ break;
+ }
+
+ // figure out the vertical positionable offset
+ switch(array_positionableAnchor_chunks[1])
+ {
+ case 'middle':
+ positionableOffset_y -= ($elem.outerHeight() / 2);
+ break;
+
+ case 'bottom':
+ positionableOffset_y -= $elem.outerHeight();
+ break;
+ }
}
-
- var offset_vertical_px = parseInt(array_offset_chunks[1]);
- // if: a valid integer was specified for the vertical offset
- // then: apply it to the calculated vertical offset
- if (!isNaN(offset_vertical_px))
+
+ if (array_targetAnchor_chunks.length == 2)
{
- positionableOffset_y += offset_vertical_px;
+ // figure out the horizontal target offset
+ switch (array_targetAnchor_chunks[0])
+ {
+ case 'center':
+ positionableOffset_x += (targetPosition.right - targetPosition.left)
/ 2;
+ break;
+
+ case 'right':
+ positionableOffset_x += (targetPosition.right - targetPosition.left);
+ break;
+ }
+
+ // figure out the vertical target offset
+ switch (array_targetAnchor_chunks[1])
+ {
+ case 'middle':
+ positionableOffset_y += (targetPosition.bottom - targetPosition.top)
/ 2;
+ break;
+
+ case 'bottom':
+ positionableOffset_y += (targetPosition.bottom - targetPosition.top);
+ break;
+ }
}
- }
- else if (array_offset_chunks.length == 1)
- {
- var offset_px = parseInt(array_offset_chunks[0]);
- // if: a valid integer was specified for the offset
- // then: apply it to the calculated horizontal and vertical offsets
- if (!isNaN(offset_px))
+
+ if (array_offset_chunks.length == 2)
{
- positionableOffset_x += offset_px;
- positionableOffset_y += offset_px;
- }
- }
+ var offset_horizontal_px = parseInt(array_offset_chunks[0]);
+ // if: a valid integer was specified for the horizontal offset
+ // then: apply it to the calculated horizontal offset
+ if (!isNaN(offset_horizontal_px))
+ {
+ positionableOffset_x += offset_horizontal_px;
+ }
- return this.each(function(){
+ var offset_vertical_px = parseInt(array_offset_chunks[1]);
+ // if: a valid integer was specified for the vertical offset
+ // then: apply it to the calculated vertical offset
+ if (!isNaN(offset_vertical_px))
+ {
+ positionableOffset_y += offset_vertical_px;
+ }
+ }
+ else if (array_offset_chunks.length == 1)
+ {
+ var offset_px = parseInt(array_offset_chunks[0]);
+ // if: a valid integer was specified for the offset
+ // then: apply it to the calculated horizontal and vertical offsets
+ if (!isNaN(offset_px))
+ {
+ positionableOffset_x += offset_px;
+ positionableOffset_y += offset_px;
+ }
+ }
+
// TODO: currently rounding calculated left and top offset to the
nearest whole number
// as calling $.offset() in Firefox 3.5 strangely toggles between
(X.Y) and (X) given
// X as an offset when called successively. should be
investigated...
- $(this).offset({
+ $elem.offset({
left: Math.round(targetPosition.left + positionableOffset_x),
top: Math.round(targetPosition.top + positionableOffset_y)
});