In an attempt to think through the logic of the goal, here is more
written out.
Also, I have a much greater understanding of css than jquery at this
time.
A pass at writing out the logic:
Determine the height of div “container” after the content is loaded.
• If the height of “container” is greater than 400px
Add class “sizer”
ß .sizer { overflow:hidden; height:400px; }
o Allow the paragraph inside div with class of “tag” to stay displayed
(don’t do anything to it).
o The link that is in the paragraph that is inside the div with the
class of “tag” becomes a show/hide trigger. When clicked, allow
“container” to be full size (remove class “sizer” ?)
o When class “sizer” is added, there needs to be a way to add
something to the where the content gets cut off. It would look/act
like a truncate function.
ß Perhaps something that counts back 5 characters from where it gets
cut off and then add “…”
• If the height of “container” is less than 400px
o Add class “sizer”
ß .sizer { overflow:hidden; height:400px; }
ß This should keep a container with little or no content from
collapsing down beyond 400px.
o Add class to paragraph inside div with class of “tag”. Add “.show-
none”
ß .show-none {display:none;}
Here is the code to work from updated:
http://paste.pocoo.org/show/88630/
