Friday, May 22, 2009

Using jQuery to Display Image Thumbnails in a Document Library

The SharePoint picture library is nice but unfortunately does not allow Content Approval to be used. One way to make pictures stored in a document library more accessible is to use jQuery to replace the default image icon with a thumbnail of the actual picture.

Before

Before

The following jQuery was added to a Content Editor Web Part on the All Documents view.

<SCRIPT language=javascript src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type=text/javascript></SCRIPT>

<SCRIPT defer type=text/javascript>
$(document).ready(function(){
$("img[src$='icjpg.gif']").each(SetImage);

});
function SetImage()
{

$(this).attr('height','100');
$(this).attr('src',$(this).parent().attr('href'));

}
</SCRIPT>

After

image

1 comment:

Anonymous said...

Absolute LIFESAVER!

THANK YOU.