How to create and add cool tooltips into web page

May 8, 2009

To create fading tooltips is easy cake.
Here are the steps:

  1. Download MooTools JavaScript framework from it’s website, http://www.mootools.com or you can find it inside this archive.
  2. Include CSS file, tooltips.css.
  3. Include JS file, tooltips.js.
  4. Make sure an image file named bubble.png is in images folder.
  5. And finally you need to add class=”tooltip” and title=”Tooltip Title :: Description goes here” on every HTML object you want to have tooltip on it.

Download the full example here.

Advertisements

Scrolling Text on Your Browser Title Bar

September 30, 2007

Add the following into the <HEAD> section of your page, replacing the default <title> tag:

<title>Welcome to Frozenade's Zone.  </title>
<script>

//Document title scroller- By Graeme Robinson (me@graemerobinson.co.uk)

var repeat=0 //enter 0 to not repeat scrolling after 1 run, othersise, enter 1
var title=document.title
var leng=title.length
var start=1
function titlemove() {
titl=title.substring(start, leng) + title.substring(0, start)
document.title=titl
start++
if (start==leng+1) {
start=0
if (repeat==0)
return
}
setTimeout("titlemove()",140)
}
if (document.title)
titlemove()
</script>