Skip to content

Tool Tips on History.html

Wwcam | Ethan edited this page Nov 15, 2015 · 2 revisions

Demo: http://skinwinners.com/history.html

What you'll need:

The updated version of the website with the history.html and get-history.php page. http://www.tippedjs.com for tooltips Refer to this hastebin for the sections: http://hastebin.com/ohemujidev.coffee

This is incredibly easy.

  1. Download Tippedjs and put it into your website directory in the /css and /js file. The file paths for Tippedjs should be /css/tipped.css and /js/tipped.js. You can change it if you want but it's easier this way.

  2. Go to your 'history.html' page and add the first section of the hastebin to the head. This can be added anywhere in the head, but it must have the correct file location.

  3. Next we will add the next section in the hastebin into the script. You will have to add this in the opening function or it will not load.

  4. Finally we will go to the last section of the hastebin and change the one line to include the itemName in the title and class to have "showTooltip" so it is a registered tooltip.

  5. Before the if statement containing "rounds.length != 10" add in "Tipped.create('.showTooltip');" to prevent bugs.

  6. Reload the page and enjoy. This will show the item name when you hover over it.

Clone this wiki locally