Side navigation
#1335 closed enhancement (wontfix)
Opened June 29, 2007 09:11PM UTC
Closed March 31, 2008 02:17AM UTC
Last modified March 15, 2012 04:44PM UTC
jQuery.fn.overlap, check overlap and apply callback (requires Interface jQuery.iUtil)
Reported by: | artistan | Owned by: | stefan |
---|---|---|---|
Priority: | minor | Milestone: | 1.1.3 |
Component: | interface | Version: | 1.1.2 |
Keywords: | overlap | Cc: | |
Blocked by: | Blocking: |
Description
this is an overlap checker that allows you to apply a function ('callback') to an element IF it overlaps anything matched by the 'check' setting (requires Interface jQuery.iUtil)
I am currently using it to fade out a banner ad on the top right portion of my pages if the banner ad is overlapping certain elements on the page.
// jQuery function (function() { jQuery.fn.overlap = function(settings){ var oElements = this; // the elements that may be overlapping another element // define default options and override with settings by extending. settings = jQuery.extend({ check: 'body', callback: remove },settings); // loop return oElements.each(function(){ // current element var oElement = this; var overlaping = false; var checkThese = jQuery(settings.check); // get main (1st) box data var b1 = jQuery.extend(jQuery.iUtil.getSize(this),jQuery.iUtil.getPosition(this)); checkThese.each(function(){ // only need to check while no overlaping found if(!overlaping){ // get this (2nd) box data var b2 = jQuery.extend(jQuery.iUtil.getSize(this),jQuery.iUtil.getPosition(this)); //check overlap if ( $(this).css('display')!="none" && oElement.id != this.id && ( (b1.y<b2.y && b1.y+b1.h>b2.y) || (b1.y<b2.y+b2.h && b1.y+b1.h>b2.y) ) && ( (b1.x<b2.x && b1.x+b1.w>b2.x) || (b1.x<b2.x+b2.w && b1.x+b1.w>b2.x) ) ){ overlaping = true; //alert(b2.y + '-' + b2.x + '-' + b2.h + '-' + b2.w); //$(this).css({ postion:"absolute",top:"1px",left:"1px",color: "red", background: "blue" }); } } }); if(overlaping){ settings.callback(oElement); //alert('overlap'); } }); } })(jQuery); remove = function (oElement){ setTimeout(function(){if($(oElement).css('display')!='none'){$(oElement).fadeOut('slow');}},10000); } $(function(){ // check if overlapping another cell $("#side_ad_1").overlap({check:'body > div, table > tbody',callback:remove}); });
Attachments (0)
Change History (1)
Changed March 31, 2008 02:17AM UTC by comment:1
resolution: | → wontfix |
---|---|
status: | new → closed |
Interface is no longer supported; consider switching to jQuery UI.