Skip to main content
Sign In |
  Help (new window)

SimpleTip Example

Go Search
Home
T o p i c P o i n t
B l o g P o i n t
E x a m p l e P o i n t
C o n s u l t i n g P o i n t
  

View All Site Content

B i t s O f S h a r e P o i n t C o n s u l t i n g L L C > ExamplePoint > SimpleTip Example

 ‭(Hidden)‬ SimpleTip Code
Tool Tip - Configuration
Overview Here you can add tool tips to any link on the page.
OPTIONS
---- Change only the gray boxes on this page. ----
Help Link - Type name of the link from the Quick Launch. For example you would type Calendar or Shared Documents. This will identify which item to create the tooltip on.
Tip - Type what you want to see in the tool tip here. You can bold, change font size and add bullets as needed.
Option 1-Link
Link Shared Documents
Tip

Add Here

  • Add Bullets
Option 2-Link
Link Calendar
Tip Add Here
Option 3-Link
Link Tasks
Tip

Add Here

  1. Add Bullets
Option 4-Link
Link Team Discussion
Tip Add Here
Option 5-Link
Link Add Here
Tip Add Here
Option 6-Link
Link Add Here
Tip Add Here
Option 7-Link
Link Add Here
Tip Add Here
Option 8-Link
Link Add Here
Tip Add Here
Option 9-Link
Link Add Here
Tip Add Here
Option 10-Link
Link Add Here
Tip Add Here
Option 11-Link
Link Add Here
Tip Add Here
Option 12-Link
Link Add Here
Tip Add Here
Option 13-Link
Link Add Here
Tip Add Here
Option 14-Link
Link Add Here
Tip Add Here
Option 15-Link
Link Add Here
Tip Add Here
Option 16-Link
Link Add Here
Tip Add Here
Option 17-Link
Link Add Here
Tip Add Here
Option 18-Link
Link Add Here
Tip Add Here
Option 19-Link
Link Add Here
Tip Add Here
Option 20-Link
Link Add Here
Tip Add Here
Option jQuery File
Value http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
Help Only change this option if you want to use a local copy of the jQuery file.
Option Simple Tip jQuery File
Value http://jquery-simpletip.googlecode.com/files/jquery.simpletip-1.3.1.js
Help Only change this option if you want to use a local copy of the Simple Tip jQuery file.
---- Change only the gray boxes on this page. ----

Please do not Edit, Change or Add any information below this line.

Errors: Please open Rich Text Editor to fix the listed errors.

Tool Tip Solution for Quick Launch or any other Link List

Welcome to this example where you can add Tool Tips to any links.  I have chosen to focus on the Quick Launch as this is an area where many users what each of these links will provide them when they click on them.

To me, tool tips are a perfect way to help users understand what they will be navigating to.  In WSS tool tips are not available and so I found an opportunity to create something that could be used for others to add this feature.

This solution is now much simpler to use.  Version 2.0 no longer takes knowing the links you want to have a tool tip and the tip you want to provide.  Now you just identify the link by its name.

Mouseover any of the links on the left hand Quick Launch to see the tool tip.

Tool tip has been incorporated into the solution, but you find details here if you want to learn more: http://code.google.com/p/jquery-simpletip/

I will be evaluating version 2 after it comes out of beta as it has many more features.

Simple Tip With SharePointDate Updated: 01/12/2010 - UPDATED

VERSION 2.0

This version 2.0 is much simpler to implement and use.  Download the Web Part and place on your site.  Edit in the Rich Text Editor to make all changes.

Download here: Tool Tip 2.0

VERSION 1.0

Date Updated: 02/17/2009
This JQuery solution provides a tool tip for any link that you identify. If you use the .js file then you will need to have .css file as well. If you load the webpart are parts are included, or paste in the code below into a CEWP.









Tool Tip - Configuration
OverviewHere you can add tool tips to any link on the page.


OPTIONS
---- Change only the gray boxes on this page. ----
HelpLink - Type name of the link from the Quick Launch. For example you would type Calendar or Shared Documents. This will identify which item to create the tooltip on.
Tip - Type what you want to see in the tool tip here. You can bold, change font size and add bullets as needed.
Option1-Link
LinkAdd Here
TipAdd Here
Option2-Link
LinkAdd Here
TipAdd Here
Option3-Link
LinkAdd Here
TipAdd Here
Option4-Link
LinkAdd Here
TipAdd Here
Option5-Link
LinkAdd Here
TipAdd Here
Option6-Link
LinkAdd Here
TipAdd Here
Option7-Link
LinkAdd Here
TipAdd Here
Option8-Link
LinkAdd Here
TipAdd Here
Option9-Link
LinkAdd Here
TipAdd Here
Option10-Link
LinkAdd Here
TipAdd Here
Option11-Link
LinkAdd Here
TipAdd Here
Option12-Link
LinkAdd Here
TipAdd Here
Option13-Link
LinkAdd Here
TipAdd Here
Option14-Link
LinkAdd Here
TipAdd Here
Option15-Link
LinkAdd Here
TipAdd Here
Option16-Link
LinkAdd Here
TipAdd Here
Option17-Link
LinkAdd Here
TipAdd Here
Option18-Link
LinkAdd Here
TipAdd Here
Option19-Link
LinkAdd Here
TipAdd Here
Option20-Link
LinkAdd Here
TipAdd Here
OptionjQuery File
Valuehttp://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
HelpOnly change this option if you want to use a local copy of the jQuery file.
OptionSimple Tip jQuery File
Valuehttp://jquery-simpletip.googlecode.com/files/jquery.simpletip-1.3.1.js
HelpOnly change this option if you want to use a local copy of the Simple Tip jQuery file.
---- Change only the gray boxes on this page. ----





Please do not Edit, Change or Add any information below this line.









Errors: Please open Rich Text Editor to fix the listed errors.