Skip to Main Content
MooTools 1.3 Cookbook
book

MooTools 1.3 Cookbook

by Jay L Johnston
July 2011
Intermediate to advanced content levelIntermediate to advanced
276 pages
5h 11m
English
Packt Publishing
Content preview from MooTools 1.3 Cookbook

Saving space on our site: the "more" button that shows more with a transition

The "more" link is a frequently used space saver. More frequently than not, it links to another page with a clunky HTTP refresh. In this recipe, we see how to save the space and keep the data on the page, for both the search engines and our users.

Getting ready

We start with an outer DIV that hides overflow and has styles that limit the height. Putting the actual text within an inner DIV will allow us to pick up the natural, auto-height of the element based on its text.

<style type="text/css">
.news_outer { height:40px; width:400px; overflow:hidden; }
...

How to do it...

Set a listener on the DIV, which starts out as reading More on screen. Toggle that text to and from ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Jump Start Web Performance

Jump Start Web Performance

Craig Buckler

Publisher Resources

ISBN: 9781849515689Other