r2721 - + Added positionTo_revert stub and tweaked support for scroll events.
Author: vtGavin
Date: Fri Jun 12 08:33:10 2009
New Revision: 2721
Modified:
branches/dev/positionTo/demos/positionTo/default.html
branches/dev/positionTo/ui/utils.positionTo.js
Log:
+ Added positionTo_revert stub and tweaked support for scroll events.
Modified: branches/dev/positionTo/demos/positionTo/default.html
==============================================================================
--- branches/dev/positionTo/demos/positionTo/default.html (original)
+++ branches/dev/positionTo/demos/positionTo/default.html Fri Jun 12
08:33:10 2009
@@ -36,10 +36,16 @@
<script type="text/javascript">
$(function() {
- $('div#positionTo_positionable').positionTo(
- $('div#positionTo_parent')[0],
- {}
- );
+ $('input#positionTo_button').bind('click', function(){
+ $('div#positionTo_positionable').positionTo(
+ $('div#positionTo_parent')[0],
+ {}
+ );
+ });
+
+ $('input#positionRevert_button').bind('click', function(){
+ $('div#positionTo_positionable').positionRevert();
+ });
});
</script>
@@ -57,6 +63,14 @@
<div id="positionTo_positionable">
w00t!
+
+</div>
+
+<div style="padding: 20px;">
+
+ <input id="positionTo_button" type="button" value="Position"
+ style="margin-right: 25px;"/>
+ <input id="positionRevert_button" type="button" value="Revert"/>
</div>
Modified: branches/dev/positionTo/ui/utils.positionTo.js
==============================================================================
--- branches/dev/positionTo/ui/utils.positionTo.js (original)
+++ branches/dev/positionTo/ui/utils.positionTo.js Fri Jun 12 08:33:10 2009
@@ -10,8 +10,14 @@
* Depends:
* ui.core.js
*/
-$.fn.positionTo = function(parentElem, options)
-{
+
+$.fn.positionTo = function(parentElem, options){
+ var positionTo_handlers = {
+ scroll: function(){
+ console.log('scroll detected');
+ }
+ };
+
var $parentElem = $(parentElem),
parentOffset = $parentElem.offset(),
// store the border widths (if they exist) for the parent element
@@ -36,16 +42,18 @@
.css('position', 'absolute')
.css('margin', '0');
- /*
- alert('parentOffset.left = ' + parentOffset.left + "\n"
- + '$parentElem.outerWidth() = ' + $parentElem.outerWidth() + "\n"
- + 'positionable.left = ' + (parentElem_coords.right + 1));
- */
-
// !!! arbitrarily position the element
- this.css('left', (parentElem_coords.right + 1) + 'px')
+ this.css('left', parentElem_coords.right + 'px')
.css('top', parentElem_coords.top + 'px');
-
+
+ // bind document and all 'parent' parent divs to scroll event and
ensure that position
+ // is adjusted to match the new scroll left/top values
+ $(document).bind('scroll.positionTo_uniqueNodeID',
positionTo_handlers.scroll);
+ $parentElem.parents().each(function(ctr){
+ $(this).bind('scroll.positionTo_uniqueNodeID',
positionTo_handlers.scroll)
+ .addClass('positionTo_tagged_uniqueNodeID');
+ });
+
/**
var _options = $.extend({
around: 'mouse',
@@ -118,3 +126,18 @@
}*/
};
+
+/**
+ * Whereas positionTo(...) moves an element to a particular location,
positionRevert()
+ * essentially moves the element back to its initial location (if it was
previously moved using positionTo)
+ * and unbinds any events previously attached to it.
+ *
+ * Meant to be used in tandem with positionTo(...).
+ */
+$.fn.positionRevert = function()
+{
+ $(document).unbind('.positionTo_uniqueNodeID');
+ $('.positionTo_tagged_uniqueNodeID').unbind('.positionTo_uniqueNodeID')
+ .removeClass('positionTo_tagged_uniqueNodeID');
+}
+
Topic Participants
scott.gonzalez