Purplecoat.js - Simple Labeled Overlays

Purplecoat.js lets you create labeled overlays that can be triggered with a click. And you don't need to write a single line of Javascript.

sex shop sex shop sex shop sex shop sex shop seks shop spanish fly psikolog sohbet numara sohbet hatti

Source: ellekasai.github.io

1. INCLUDE JS FILES

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="purplecoat-min.js"></script>

2. HTML

Step 1: Add data-purplecoat="foo" and data-purplecoat-label="Hello!" to any element.

<img data-purplecoat="foo"
     data-purplecoat-label="Hello!" ...>

Step 2: Add data-purplecoat-toggle="foo" to any clickable element.

Now, go ahead and click this button to show the overlay label. Click again to hide the label.

<button data-purplecoat-toggle="foo" ...>
  ...
</button>

(Explanation: The value of data-purplecoat-toggle must match the value of data-purplecoat to make this all work.)