Bug Tracker

Opened 17 years ago

Closed 17 years ago

Last modified 11 years ago

#184 closed feature (fixed)

Cross Browser Dimensions

Reported by: john Owned by:
Priority: major Milestone:
Component: core Version:
Keywords: Cc:
Blocked by: Blocking:

Description

Add new cross browser methods like:

$(window).height(); $(window).width(); $(window).innerHeight(); $(window).innerWidth(); $(document).height(); $(document).width(); $(document).scrollTop(); $(document).scrollLeft();

Change History (5)

comment:1 Changed 17 years ago by anonymous

I use this rather often (shamelessly copied from Prototype):

$.fn.totalX = function() {
  var result = 0;
  var element = this.get(0);
  if (element.offsetParent) {
    while (element.offsetParent) {
      result += element.offsetLeft + (element.clientLeft || 0);
      element = element.offsetParent;
    }
  }
  else if (element.x) {
    result += element.x;
  }
  return result;
};

$.fn.totalY = function() {
  var result = 0;
  var element = this.get(0);
  if (element.offsetParent) {
    while (element.offsetParent) {
      result += element.offsetTop + (element.clientTop || 0);
      element = element.offsetParent;
      // Hack.. Seems it is a good idea to ignore forms in IE. Don't know why
      if (element.clientTop != null && element.tagName.toLowerCase() == "form") {
        element = element.offsetParent;
      }
    }
  }
  else if (element.y) {
    result += element.y;
  }
  return result;
};

comment:2 Changed 17 years ago by paul

Owner: changed from paul to anonymous
Status: newassigned

I added a new core plugin called dimensions.js, which has been added to the SVN trunk. Currently, it knows the functions height(), width(), innerHeight(), innerWidth(), outerHeight(), outerWidth, scrollLeft() and scrollTo().

Next features coming are the global offset functions!

comment:3 Changed 17 years ago by liquid@…

to allow for this behavior without digging into the dom and therefore just relying in $().height()... would be useful to get added to this library:

    function resize_iframe() {
        $('iframe').each(function() {
            if ($(this).attr('scrolling') == 'no') {
                $(this).height(this.contentWindow.document.body.scrollHeight + 'px');
            }
        });

what i would like to see is $('iframe').contentHeight() to return cross browser compatible height of the content inside the iframe...

$('iframe').get(0).contentWindow.document.body.scrollHeight seems to work for that.

here is a patch:

--- dimensions.js.orig	2006-09-13 20:58:49.562500000 -0500
+++ dimensions.js	2006-09-13 21:08:20.656250000 -0500
@@ -163,3 +163,19 @@
 	}	

 	return this.get(0).scrollTop;

 }
 No newline at end of file
+
+/**
+ * Returns the real height of content
+ *
+ * @example $("#testiframe").contentHeight()
+ * @result [ 800px ]
+ * 
+ * @name contentHeight
+ * @type jQuery
+ * @cat Dimensions
+ */
+$.fn.contentHeight = function() {
+	if(this.get(0) == window || this.get(0) == document) return this.height();
+	return this.get(0).contentWindow.document.body.scrollHeight;
+}
+

more work will probably need to be done on this if its extended past iframes (to retun something for other elements with an error.. but you get the point)... thoughts?

comment:4 Changed 17 years ago by brandon.aaro

I had some issues with the Position methods in prototype so I actually wrote a very comprehensive getOffset function that takes options and all. I don't think the options are really necessary and I think it could probably be optimized some but here it is: http://www.brandonaaron.net/articles/2006/08/10/prototype-extensions-element-getoffset

I wouldn't mind converting this to a jQuery plugin if anyone needs it. I already have used a simplified version of it in one of my own plugins.

comment:5 Changed 17 years ago by brandon

Resolution: fixed
Status: assignedclosed

The dimensions.js now has an offset method for getting the position of an element.

It seems that the proposed contentHeight method is a specialized case and should probably not be included into dimensions.js.

I'm going to close this as fixed. Feel free to re-open if any new features for dimensions.js come up or if anyone disagrees that the proposed contentHeight method shouldn't be included.

Note: See TracTickets for help on using tickets.