Friday, July 9, 2010

Image Tool tips in SharePoint using JQuery

Here is my requirement: when I mouse over a image, i should get a tool tip with screen shot for easy usage.

Here is how I've done this using J-Query:

download the jquery files and upload into a document library, from here:

jQuery Image Tool tip in SharePoint

Paste the below code inside the <asp:Content> </asp:Content> ( you can find this tag, at the end of the page)

<link rel="stylesheet" href="Support/jquery.tooltip.css" />
<link rel="stylesheet" href="Support/screen.css" />
<script src="Support/jquery.js" type="text/javascript"></script>
<script src="Support/jquery.dimensions.js" type="text/javascript"></script>
<script src="Support/jquery.tooltip.js" type="text/javascript"></script>
<script type="text/javascript">

$(function() {
delay: 0,
showURL: false,
bodyHandler: function() {
return $("<img/>").attr("src", '');


You might also like:
SharePoint Usage Reports
Usage reports, collaboration and audit for SharePoint.
Document SharePoint Farm
Automatically generate SharePoint documentation.

Check out these SharePoint products:

No comments :

Post a Comment

Please Login and comment to get your questions answered!

You might also like:

Related Posts Plugin for WordPress, Blogger...