Read More/Less

by ataylor

HTML

<!-- start reviews --><div id="AIG_reviews"><!-- start review --><div itemprop="reviews" itemscope itemtype="http://schema.org/Review" class="review even"><!-- start review header --><div class="review-header"><span itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"><meta itemprop="worstRating" content = "0"><meta itemprop="bestRating" content = "5"><meta itemprop="ratingValue" content = "5"></span><div class="review-stars" title="5 out of 5 stars"><img src='http://localhost/review-plugin/wp-content/plugins/AIG_reviews/images/fullstar.png' /><img src='http://localhost/review-plugin/wp-content/plugins/AIG_reviews/images/fullstar.png' /><img src='http://localhost/review-plugin/wp-content/plugins/AIG_reviews/images/fullstar.png' /><img src='http://localhost/review-plugin/wp-content/plugins/AIG_reviews/images/fullstar.png' /><img src='http://localhost/review-plugin/wp-content/plugins/AIG_reviews/images/fullstar.png' /></div>By <span itemprop="author" class="review-client">Bob Marley</span> on <span itemprop="datePublished" class="review-date">March 30, 2012</span> </div><!-- end review header --><!-- start review excerpt --><div class="review-excerpt" itemprop="description">&#8220;At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et.... <a href="#" class="read-more">Read more</a></div><!-- end review excerpt --><!-- start review content --><div class="review-content" itemprop="description">"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus,...

CSS

#AIG_reviews, #AIG_reviews * {
    position:relative;
    font-family:'Arial';
    line-height:18px;
}

#AIG_reviews {
    margin:25px auto;
    overflow:hidden;
}

#AIG_reviews .review {
    margin-bottom:2%;
    padding:2% 0;
    border-bottom:dashed 1px #000;
    overflow:hidden;
    width:auto;
}

#AIG_reviews .review-header {
    margin-bottom:10px;
}

#AIG_reviews .review-client {
    font-size:16px;
    font-weight:bold;
}

#AIG_reviews .review-content {
    
}

#AIG_reviews .review-stars {
    float:left;
    margin-right:10px;
    top:-2px;
}

JavaScript

//$(document).ready(function(){ //start doc ready
/*start all testimonial*/
//hide all full length reviews
$('#AIG_reviews .review-content').hide().slideUp();
//when read more is clicked hide excerpt and show content
$('#AIG_reviews .review-excerpt').each(function() {
    $(this).children('a.read-more').click(function() {
        $(this).parent().slideUp(1000);
        $(this).parent().siblings('.review-content').slideDown(1000);
        var height = $(this).siblings('.review-content').height();
        $('html').animate({
            scrollTop: '+=' + height
        }, 1000);
        return false;
    });

});
//when read less is clicked hide content and show excerpt
$('#AIG_reviews .review-content').each(function() {
    $(this).children('a.read-less').click(function() {
        $(this).parent().slideUp(1000);
        $(this).parent().siblings('.review-excerpt').slideDown(1000);
        var height = $(this).siblings('.review-excerpt').height();
        $('html').animate({
            scrollTop: '+=' + height
        }, 1000);
        return false;
    });

}); /*end all testimonial*/
//});//end doc rdy