css check if element is overflowing code example

Example 1: jquery detect if element has overflow

if ($("#myoverflowingelement").prop('scrollWidth') > $("#myoverflowingelement").width() ) {
	//this element is overflowing on the x axis
}

if ($("#myoverflowingelement").prop('scrollHeight') > $("#myoverflowingelement").height() ) {
	//this element is overflowing on the y axis
}

Example 2: javascript check if element is overflowing

// Determines if the passed element is overflowing its bounds,
// either vertically or horizontally.
// Will temporarily modify the "overflow" style to detect this
// if necessary.
function checkOverflow(el)
{
   var curOverflow = el.style.overflow;

   if ( !curOverflow || curOverflow === "visible" )
      el.style.overflow = "hidden";

   var isOverflowing = el.clientWidth < el.scrollWidth 
      || el.clientHeight < el.scrollHeight;

   el.style.overflow = curOverflow;

   return isOverflowing;
}