arc90 lab : tools : Link Thumbnail
Popularity Report
 |
|||
|
|||
|
|||
|
|||
|
|||
|
Rank
URL Tag Cloud
Bookmark History
Saved by 41 people (12 private), first by anonymouse user on 2006-07-22
- Klozer on 2008-08-03 - Tags thumbnail , javascript
- Hetgelaat on 2008-03-25 - Tags ajax , css , html , javascript , thumnail , tool , webdesign , webdev
- Angrymeili on 2008-03-20 - Tags presentation , unsorted , web , widget
- Frankalcantara on 2008-02-23 - Tags ajax , development , javascript
- Howell on 2007-12-06 - Tags css and html , it , web design
Public Sticky notes
A little bit JavaScript, a little bit CSS and a little bit clairvoyance, Link Thumbnail shows users that are about to leave your site exactly where they're going. When that curious mouse pointer hovers over a link pointing to somewhere outside of your site, the script displays a small image of the destination page. It's a nice visual cue that serves a very real purpose: providing a clearer picture (no pun intended) of what's ahead.
Highlighted by ycc2106
The arc90 lab is the playground of arc90 - a New York-based technology and strategic consulting firm. The lab is a place for us to share our ideas, tools and the occasional experiment in web technology. All ideas, experiments and tools are licensed under Creative Commons.
This site is licensed under a Creative Commons Attribution 2.5 License.
Tools
Link Thumbnail
A picture's worth a thousand words, right? So spice up those plain old text links with Link Thumbnail, the second tool from the arc90 lab.
What is this?
A little bit JavaScript, a little bit CSS and a little bit clairvoyance, Link Thumbnail shows users that are about to leave your site exactly where they're going. When that curious mouse pointer hovers over a link pointing to somewhere outside of your site, the script displays a small image of the destination page. It's a nice visual cue that serves a very real purpose: providing a clearer picture (no pun intended) of what's ahead.
How Do I Use It?
Download the Code
Click on the icon below to download the source code for Link Thumbnail:
The file, linkthumb.zip, contains the script, one required image and an example page. Once downloaded, upload the script and the image to your site. They must be in the same directory.
Link to the Javascript and Add Style
Add a link to the javascript in the page(s) you'd like Link Thumbnail implemented. Remember to adjust the path to properly point to the location of the file on your server. Then, you need to a line of CSS code. You can copy this entire block and paste it into your <head> section:
Highlighted by compwoman
Highlighted by rui_mashita
Public Comment
on 2006-08-04 by rikaizm
on 2006-12-24 by svartling