Here is online sample http://jsfiddle.net/bvJnM/
Somehow linkedin profile doesn’t pop up. Could someone please check my code?
function excerpt(str, nwords) {
var words = str.split(' ');
words.splice(nwords, words.length - 1);
return words.join(' ') + '…' + '<span>Show</span>';
}
var $div = $('.container');
$div.each(function() {
var theExcerpt = excerpt($(this).text(), 30);
$(this).data('html', $(this).html()).html( theExcerpt);
});
$('span').click(function() {
var isHidden = $(this).text() == 'Show';
var $div = $(this).parent();
var theExcerpt = excerpt($div.text(), 30);
$div.html( isHidden ? $div.data('html') : theExcerpt);
$(this).remove();
});
HTML
<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>
<div class="container">
Nulla varius diam at sem adipiscing pharetra. Integer eget nulla non purus commodo aliquam. Aenean sed nunc neque. Aliquam eleifend aliquam arcu, ac semper nulla faucibus id. Etiam luctus eleifend tempus. Vestibulum ornare, nisi vitae fermentum luctus, sem lectus rhoncus nibh, auctor iaculis magna turpis nec turpis. Aliquam orci tortor, vulputate at pretium sit amet, blandit eget libero. Sed posuere ultricies mi, sed rhoncus massa ultrices quis. Donec pulvinar vestibulum rhoncus. Donec urna lacus, mollis et convallis at, commodo nec lectus. Maecenas pretium, nunc ac volutpat tempus, dolor orci ultricies massa, eu malesuada urna massa ut orci. Duis eget elit nulla, ornare aliquet nulla. Sed eleifend scelerisque est, eu laoreet lacus ultricies id. Aenean aliquam porttitor augue, quis lacinia augue consequat vitae. Ut venenatis orci massa. Duis dignissim, justo at pellentesque adipiscing, ligula eros mollis tellus, ut accumsan lorem dui eu est.
<p></p>
<script src="http://platform.linkedin.com/in.js" type="text/javascript"></script>
<script type="IN/MemberProfile" data-format="click" data-id="http://www.linkedin.com/in/reidhoffman"
data-format="inline" data-text="mynamehere"></script>
after expanding the linkedIn link doesnt work…
Well lets try it this way:
Put the text in
ptab and do splicing-dicing on it. put linked in scripts in their own space and hide it. Then wen you show the complete text, also show the linkedin div also.
I have updated the fiddle here: fiddle1
EDIT: working fiddle. The
<span>is appended to the<p>and I used$(this).parent().find('p'). It was to be$(this).parents('div').find('p')