Toolboxes mit Hintergrundbild 2a

2. Versuch mit dem Zoobild

Ausgang: Diese Rechtecke sollen gefunden werden. Sie sind auf dem Suchbild jedoch unsichtbar.
Beim Überfahren mit der Maus wird ein Infotext eingeblendet.

Wie habe ich das realisiert?

Fündig wurde ich hier. So sah die Lösung aus, die ich suchte. 
Anschließend wird der Text aus der heruntergeladenen Datei kopiert und im Editor (z.B.Notepad++) in stylesheet.css des verwendeten Templates eingefügt.
Nun muss diese stylesheet.css bearbeitet werden:
– bei background-image: url(des Bildes) die Adresse des Bildes eingetragen. Dazu müssen auch die Weite und Höhe des Bildes unter grafik → width: 496px und height: 244px angepasst werden.
– bei .position_1; position_2, position_3 usw. werden die Rechtecke (gekennzeichnet durch width: 150px und height: 40px) im Hintergrundbild ausgerichtet. Das ist schon etwas Arbeit. Ich habe mir das etwas erleichtert, dass ich bei jeweils border: 0px solid green in border: 4px solid green geändert habe. So habe ich sofort gesehen, wo dieses Rechteck, das ich bearbeitet habe, entstand bzw. an welcher Einstellung ich noch Änderungen vorzunehmen hatte.
– Nachdem dies zu meiner Zufriedenheit eingerichtet war, änderte ich wieder border: 0px solid #eee, damit die Rechtecke unsichtbar erscheinen.

Als das geklappt hatte, machte ich mich an die Lösung meines Wunsches.