Mouseover popup-Sprechblase

Ich bin neu in javascript/css und würde gerne eine version von ein mouseover-popup ähnlich dem, welches zeigt über die unterstrichenen Wörter hier: http://st.japantimes.co.jp/essay/?p=ey20141219
Ich kann sehen, dass der code, der verwendet wird, aber ich bin mir nicht sicher, wo/wie man in meine eigene Sprechblase Bild, wenn ich den code Bearbeiten, der für mein eigenes Projekt.

Hier ist ein Beispiel für den code verwendet, auf der referenzierten Seite:

HTML:

<a style="cursor:pointer;" onclick="showChuPopup(event,'<b>’Twas</b><br />It was の省略');return false;" onmouseover="showChuPopup(event,'<b>’Twas</b><br />It was の省略');" onmouseout="endChuPopup();">’Twas</a>

Javascript:

function showChuPopup(e,text){
if(document.all)e = event;

var obj = document.getElementById('chu_popup');
var obj2 = document.getElementById('chu_popup_text');
obj2.innerHTML = text;
obj.style.display = 'block';
var st = Math.max(document.body.scrollTop,document.documentElement.scrollTop);/*
if(navigator.userAgent.toLowerCase().indexOf('safari')>=0)st=0;*/
var leftPos = e.clientX - 100;
if(leftPos<0)leftPos = 0;
obj.style.left = leftPos + 'px';
obj.style.top = e.clientY - obj.offsetHeight -1 + st + 'px';} function endChuPopup() {
document.getElementById('chu_popup').style.display = 'none';} function touchHandler(e){
document.getElementById('chu_popup').style.display = 'none';}

Vielen Dank für jede Hilfe oder Ideen.

InformationsquelleAutor Eva | 2017-05-22
Schreibe einen Kommentar