Figuring out if overflow:auto would have been triggered on a div

// Major edit, sorry in bed 开发者_Go百科with back pain, screwed up post

One of the ad agencies I code for had me set up an alternate scrolling solution because you know how designers hate things that just work but aren't beautiful.

The scrolling solution is applied to divs with overflow:hidden and uses jQuery's scrollTo(). It's a set of buttons top and bottom that handle moving the content.

So, this is married in places to their CMS. What I have not been able to sort yet is how to hide the scrolling UI when overflow:auto would not have been triggered by the CMS content and the buttons are not needed.

The divs have set heights and widths. Can i detect hidden content? Or measure the div contents' height?

Any ideas?

So you want to get the height of a hidden element? I found this post maybe it is what you are looking for.

Its using jQuery, but the concept is the same. Hope this helps!

Metropolis

I hope i am mistaken, but you would need to emulate overflow by setting properties using some js, then you can get these values using getAttribute or your own method. Otherwise when you set overflow to auto, then the browser will be doing its own thing and the only value returned as a property of overflow would be a string like 'auto'.

Can you explain this better? You want to hide the scrollbar of a div set to overflow:auto when it doesnt have enough text to overflow? Browser does this for you.

You want to hide the scrollbar of a div set to overflow auto when it is scrolled down to some point, but you arent looking at it or hovering or something? That will be sort of complicated.

If you want to know if a div has overflow set to something, you just do:

object.style.overflow

and it will give you a string.

possible values:

visible
hidden
scroll
auto
inherit

you can set overflow the same way

http://www.w3schools.com/css/pr_pos_overflow.asp

from what i understand now is you have these divs with hidden scroll, but some graphic designer custom scroll bar and you use scrollTo to do the actual scrolling. BUT you problem lies when you dont have enough data to actuall need a scrollbar, but your graphic stuff shows up anyway, so you want to hide it.

so the real question here is how do you get the height of content? you want the property offsetHeight, but im pretty sure its still IE only.

What do you mean by CMS?

Yes you can access the div's content height, since you can access all of the div's children in JavaScript. (Sorry for not including example. I haven't work with pure JS in a while now so I don't want to point you in the wrong direction.) Doing this, you'll kind of be able to "detect hidden content" and then be able to do what you actually want to do.

About your first question, I doubt you can control scroll bars once you've set overflow to auto.

Using jQuery height() on a div containing the content I am able to show/hide the user interface as needed based on whether height exceeds the CSS height of the div with overflow:hidden.