Showing / Hiding text when a link is clicked

It's sometimes useful to hide text on a page and only show it when a user clicks a relevant link. On a Frequently Asked Questions (FAQ) page for example. Try the following links. Click to show, click to hide again.

 What is Microsoft FrontPage?

 What is MSN Search?


How?

Copy the following JavaScript function within the head tags of your page:

Now, as an example, copy the code below into the body of your page.

All you need then is to copy the '+' and '-' images straight off this page. Right-Click the image then 'Save Picture As' and select where you want to save it, for this example the 'images' folder of the site where the page is located.

 


Design and Development News



Expression Blend and Design
  • Switching Visual States Easily using GoToStateAction Over the next couple of weeks, it seems like a good idea to go over some of the behaviors we shipped as a part of Expression Blend 3. Many of you have mentioned that you would like to learn more about the stock behaviors we ship and how they are used,...(read more)
  • Limited Time: 30% Discount on Expression Studio 3 Hi everyone, For a limited time, there is a 30% discount on all Microsoft Expression 3 products (Microsoft Expression Studio + Expression Web, both full and upgrade versions) through the Microsoft Online Store for US-based customers: No promo code required...(read more)
  • Try to Define Visuals in XAML Ok, pop-quiz time. Below, you will find two screenshots I took from two different applications: [ Screenshot 1 ] [ Screenshot 2 ] Can you tell what is different between those two images? If you said that the button in the second image seems a few pixels...(read more)
  • Download Expression Blend Preview for .NET 4 Today at PDC, we made a few announcements that would be of interest to you! First, Scott Guthrie announced the availability of the Silverlight 4 Beta . This version of Silverlight contains some cool new features that many of you have asked for, so read...(read more)
  • Working with Layout when DataContexts are Involved Hi everyone, When using Expression Blend, a common task you probably engage in is working with layout. Tasks I commonly associate with “working with layout” involve moving things around, rearranging the order of elements, ensuring everything flows when...(read more)
  • Simple Cartoon Animation using Visual States One of the goals of Silverlight’s Visual State Manager technology is to let you do quite a bit of control customization without needing to use Blend’s Timeline, nor even having to know what a Storyboard is! Feel free to test-drive the Silverlight Button...(read more)
  • Storyboards, Visual States and SketchFlow Animations What are these things – are they different ways of doing the same task? When would I use one in preference to another? Do they all work in all project types? This post will try to answer those questions by describing the animation and control customization...(read more)
  • Visual State Manager tips for design and authoring As you probably know, Silverlight and WPF have a runtime piece called the Visual State Manager (or VSM for short). As I’ll describe in this post, VSM and the Expression Blend tooling support for VSM lend a nice clean mental model to the business of visual...(read more)
  • Expression Blend 3 Survey- Win a free zune HD!!! Hello! The Expression Blend team is currently planning features for future versions of Expression Blend. We encourage everyone to take our Blend 3 Survey and send us your feedback. All eligible participants will be able to enter a drawing to win a FREE...(read more)
  • Silverlight Control Styling Tips Articles We’ve published eleven new articles on the blog and they all contain information and tips that you’ll find useful when styling common Silverlight 3 controls. First there’s an article with some general tips: it discusses template binding, different ways...(read more)
  • Keyframe Marquee Selection, and other Timeline Tips With Blend 3 it’s now possible to draw a marquee (or lasso) around keyframes to select all the keyframes that fall within it. Hold down the CTRL key then drag out a marquee with the mouse pointer as shown below. You can even begin your drag operation...(read more)
  • Using Custom Value Editors for Behaviors Ok, Jeff Kelly is back with Part IV of his coverage on behaviors-related topics. This one talks about some of the built-in value editors we provide to make it easier for your users to use behaviors that you create - Kirupa In Expression Blend 3, we’ve...(read more)
  • Blend 3 Samples Deconstructed In my previous post, I mentioned that most of the samples from previous versions of Expression Blend have been uploaded to our gallery. One thing that is common with all of the samples is that Celso Gomes had a hand in making them. Recently, Celso started...(read more)
  • All Expression Blend Samples Posted to the Expression Gallery! Hi everyone, As many of you probably already know, the Expression Community site is where you go to learn more about how to use Expression Blend. One of the big components of the Community site is the Expression Gallery where you can download and share...(read more)
  • Deep Zoom Composer Updated to Fix an Export Related Bug Hi everyone, We have released an update to last week’s Deep Zoom Composer release to address a fairly serious bug related to the image paths we generate during export. You can download the latest version from the following location: Download Deep Zoom...(read more)