With .overflown()
you can query a dom element and find out if it is being overflown, meaning if any of its children is overflowing the parent.
This might for instance be useful for navigation-menues where you'd like to display a hamburger-button or alike if all navigation-entries wouldn't fit in the container (and you don't want to linewrap your navigation-menue).
if ( $(".nav").overflown(direction) ){
$(".nav").addClass("overflown");
}
Where direction
is optional and can either be left out or be "x"
or "y"
to limit to the x- or y-axis. So if you'd like to specifically find out if an element is being overflown vertically, you'd use .overflown("y")
, otherwise just use .overflown()
To use jquery.overflown, jQuery 1.7 or newer ist required and you'd include it in your document, something like this:
// load jQuery first
<script src="https://code.jquery.com/jquery-1.7.2.min.js"></script>
// then load the .overflown() plugin
<script src="jquery.overflown.js"></script>
jquery.overflown.js was written by Zeta Software GmbH for use in Zeta Producer and is licensed under the MIT License (MIT) . This license is also supplied with the release and source code. As stated in the license, absolutely no warranty is provided.