Expandable and Contractable Text Blocks

Alternative and creative. Site must be viewed at 1024 X 1168 resolution.

This, one of our favorite JavaScript programs, allows you to control the way your information is presented. Below, the three simple headings seem harmless enough. But once clicked present a wealth of info.

Also included is an option to contract or expand all. In this manner, you also allow your audience to control the input they are receiving. Once they see that it is very involved they may choose to close it again.

Now they will opt to open and close the titles one at a time allowing themselves to focus in on the actual material that has been sorted onto the page. Go ahead and try it. We know you will be impressed.



Click to Expand


This is a handy JavaScript program which can be used if you have a lot of content on a page. It will make it much easier to get through the content if you open it one title at a time. And if the reader is looking for specific content on a page, it is simpler to narrow down the search by looking at titles only.

Display Content


This script makes changes within your HTML document or CSS sheets possible as seen in the table below which utilizes both HTML and CSS. You will note that two expandable headings have been incorporated into the table as an illustration of the flexibility of the coding.

Properties which can be changed  Yes  No
Border include / exclude  X  
Font size, type and color  X  
Include Table  X  
Cursor Type  X  
Include Link  X  
Dimensions  X  
Expand within Table (Heading)

  • Subheading 1 URLs can be inserted into bullets.
    space
  • Subheading 2 URLs can be inserted into bullets.
    space
  • Subheading 3 URLs can be inserted into bullets.
    		•  X  
    Expand within Table2 (Heading)

    statistic 1 statistic 2
    statistic 3 statistic 4
    		 X  
    Include Links  X  


    Functionalities of this script.


    For some websites we can see this script would be of great benefit. Some uses of this script that we can think of are as follows:
    space
  • Use as a very detailed navigation system. URLs can be inserted into bullets.
    space
  • Use to sort different types of information under expandible headings. For example, headings for a travel site might be: Travel in Europe, Africa, South America, Middle East and Asia. Subheadings could then narrow down the countries to France, England, Holland, Belgium, Germany. Using tables and bullets within the subheadings, information can be conveyed without the reader having to scan an entire page.
    space
  • Could be implented fantastically into an educational web site for the presentation of course information
    space
  • Would work well for a company presentation of their Human Resources Policies.
    space
  • Would be great for a retail venue to catagorize the various types of goods being sold.
    space
  • On a musical site this script could be used to present song titles within each album and expand to include song lyrics.
    space
  • A site which presents legal or contractual information could purpose this script very well.
    space
  • A historical or family tree site would find this script fantastic for sorting and presenting information.
    space
  • We can see this being used on a restaurant site to present various menus, broken down perhaps as breakfast, lunch and supper or steak, fish and chicken dishes.
    space
  • This would work well for any kind of scheduling such as a movie or TV guide.
    space
  • A book or comic site could definitely implement this.
    space
  • This would work extremely well for presenting the daily news.
    space
  • A hotel web site would find this format very good for laying out price structure of rooms and room service.
    space
  • Could be used to create a fantastic events calendar where if you click the date, the days events are revealed.
    space
    space