Ergebnis 1 bis 5 von 5

Thema: problem mit tooltips

  1. #1
    huiuiuiuiuiuiui
    Gast

    Standard problem mit tooltips

    Tag Tag

    also ich möchte ne seite wie diese machen:http://www.millionen-pixel-page.de/

    jetzt hab ich dashier:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http&#58;//www.w3.org/TR/html4/strict.dtd">
    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    
    <title>Beispiel</title><style type="text/css">
    <!--
    body&#123;
    margin&#58;0;
    padding&#58;0;
    font-family&#58;verdana;
    font-size&#58;11px;
    line-height&#58;16px;
    &#125;
    #tausend&#123;
    position&#58;absolute;
    top&#58;10px;
    left&#58;0;
    width&#58;1000px;
    height&#58;1000px;
    
    
    
    &#125;
    -->
    </style>
    <script type="text/javascript">
    <!--
    texte=new Array&#40;&#41;;
    for &#40;var i=1;i<=10000;i++&#41;&#123;
    texte&#91;i&#93;='you can buy it ';       //texte&#91;i&#93;='you can buy it '+i;
    &#125;
    var x,y,b,h,ieDoof=2,ie=typeof document.all=='object';
    function holKoord&#40;e&#41; &#123;
    if&#40;!e&#41;e=window.event;
    var scrollPos;
    if&#40;typeof window.pageXOffset!='undefined'&#41;&#123;
    x=window.pageXOffset+e.clientX;
    y=window.pageYOffset+e.clientY;
    b=window.innerWidth+window.pageXOffset;
    h=window.innerHeight+window.pageYOffset;
    &#125;
    else if&#40;typeof document.compatMode!='undefined'&&document.compatMode!='BackCompat'&#41;&#123;
    d=document.documentElement;
    x=d.scrollLeft+e.clientX;
    y=d.scrollTop+e.clientY;
    b=d.clientWidth+d.scrollLeft;
    h=d.clientHeight+d.scrollTop;
    &#125;
    else if&#40;typeof document.body!='undefined'&#41;&#123;
    d=document.body;
    x=d.scrollLeft+e.clientX;
    y=d.scrollTop+e.clientY;
    b=d.clientWidth+d.scrollLeft;
    h=d.clientHeight+d.scrollTop;
    &#125;
    if&#40;ie&#41;&#123;
    x-=ieDoof;
    y-=ieDoof;
    &#125;
    tip&#40;&#41;;
    &#125;
    function tip&#40;&#41;&#123;
    xZehn=Math.ceil&#40;x/10&#41;;
    yZehn=Math.ceil&#40;y/10&#41;;
    xZehn=x%10==0?xZehn+=1&#58;xZehn;
    yZehn=y%10==0?yZehn+=1&#58;yZehn;
    t=document.getElementById&#40;'tTip'&#41;;
    if&#40;x<0||x>999||y<0||y>999&#41;&#123;
    t.style.display='none';
    return;
    &#125;
    else t.style.display='block';
    document.getElementById&#40;'tTipU'&#41;.innerHTML='';       //document.getElementById&#40;'tTipU'&#41;.innerHTML='x='+x+', y='+y;
    document.getElementById&#40;'tTipM'&#41;.innerHTML=texte&#91;xZehn+&#40;yZehn-1&#41;*100&#93;;
    n="t_"+xZehn+"_"+yZehn;
    if&#40;t.name!=n&#41;&#123;
    t.name=n;
    document.getElementById&#40;'tTipO'&#41;.innerHTML='field &#40;'+xZehn+','+yZehn+'&#41;';
    if&#40;t.offsetWidth+xZehn*10+10<b&#41;&#123;
    t.style.left=xZehn*10+10+'px';
    &#125;
    
    else t.style.left=xZehn*10-10-t.offsetWidth+'px';
    if&#40;t.offsetHeight+yZehn*10+10<h&#41;&#123;
    t.style.top=yZehn*10+10+'px';
    &#125;
    else t.style.top=yZehn*10-10-t.offsetHeight+'px';
    &#125;
    &#125;
    document.onmousemove=holKoord;
    //-->
    </script></head>
    
    <body>
    
    <table border="0" cellspacing="0" width="1000" height="1000"><tr><td style="background-image&#58;url&#40;zehnMalZehn.gif&#41;; ">
    <div id="tausend"></div>
    <div id="tTip" style="border&#58; 2px solid black; position&#58; absolute; width&#58; 100px; background-color&#58; #eeeeee; left&#58; 0px; top&#58; 9999px; display&#58; block;  z-index&#58;3;">
    <div id="tTipO">you can buy</div>  
    <div id="tTipM">pixels</div>      
    <div id="tTipU" >dd</div>  
    </div>
    </td></tr></table>
    
    [img]./pic.gif[/img]
    
    
    </body></html>

    nun möchte ich, dass wen man über das bild fährt ein anderes tooltip kommt, als die x, y angaben.

    wie mach ich das???? ich bin nicht so gut in javascript.


    unten hab ich das hintergrundbild hinzugefügt. das pic.gif ist einfach 100 x 100 groß.


    gruß ich
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Angehängte Grafiken Angehängte Grafiken

  2. #2
    Forum Guru
    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    habemm mir das jetzt nicht alles durchgelsen aber generell gestalte dir ein div was du auf position absolut top:-500 left-500 legst und zum testen halt left un top anders machen und schön gestalten bei eien mosue over passt du automatisch die left und top werte an.

  3. #3
    uiuiuiuiuiuiui
    Gast

    Standard

    wie jetzt, des check ich ned.

    was willst du mir sagen???

  4. #4
    Gast

    Standard

    kann mir jemand helfen????

  5. #5
    Forum Guru
    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    alsoschmeize dir doch erstmal das div zusammen und mache so hübsch wie du es benötigst.

    Wenn du das nicht hinbekommst poste ich am montag ein kleine Vorlage.

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •