This was used in our product review section. It hides the end of a review that is too long to display. If the user wants to read the entire review they can click the "Full Review" button.

The only disadvantage to doing it this way is the server sends the full review to the client every time. The text is still there, only hidden. A better way to do this might be to use AJAX to load the tail end of the review from the database in real time.

Screenshot:

Usage:

Your HTML should look something like this:

First block of text
<div id='review_dots_14599' style="display: inline;">...</div>
<div id='review_14599' style="display: none;">
Ending Block of text
</div>
<a href='#' onClick="toggle_review('review_14599', this, 'review_dots_14599'); return false;">Full Review</a>

The number at the end of each div id gives each hidden chunk a text a unique udentifer that is required by the Javascript. It can be your review_id if you'd like.

You'll need this PHP to cut the review into two parts:

$cutoff_point = 1000;
$more_link = false;
$dot_style = 'none';
$length = strlen($review);

if($length > $cutoff_point)
{
    $cutoff = strpos($review, ' ', $cutoff_point);
    if(!$cutoff) { $cutoff = $cutoff_point; }

    $review_end = substr($review, $cutoff);
    $review = substr($review, 0, $cutoff);
    if($length > strlen($review))
    {
        $more_link = true;
        $dot_style = 'inline';
    }
}   

$more_link is a flag used later to determine whether we even need to display the "Full Review" link. If the review is smaller than your static $cutoff_point the link shouldn't show up.

$dot_style is used in this part:

<div id='review_dots_14599' style="display: inline;">...</div>

The display is either "none" if we don't need to show the "Full Review" link or "inline" which will make the dots appear after the cut-off text.

/* */
// Displays a hidden chunk of review or hides it.

var toggles = {};

function toggle_review(divID, buttonID, dotID)
{
    if(typeof toggles[divID] == 'undefined' || toggles[divID] == 'hidden')
    {
        document.getElementById(divID).style.display = 'inline';
        document.getElementById(dotID).style.display = 'none';
        buttonID.innerHTML = 'Hide Full Review';
        toggles[divID] = 'visible';
    }
    else
    {
        document.getElementById(divID).style.display = 'none';
        document.getElementById(dotID).style.display = 'inline';
        buttonID.innerHTML = 'Full Review';
        toggles[divID] = 'hidden';
    }
}