Ergebnis 1 bis 9 von 9

Thema: event-handler onmouseover

  1. #1
    Unregistriert
    Gast

    Standard event-handler onmouseover

    Hallo zusammen..

    Ich möchte, dass mir im Feld <AREA shape=RECT coords=3,322,449,513> ein vorgegebener Text angezeigt wird, sobald ich mit der Maus über eines der unten auch angegebenen Felder fahre. Wenn ich dann auf das entsprechende Feld klicke, springt es mir auf eine vorgegebene Seite. (Letzteres funktioniert auch schon!)
    Wie aber kann ich "onmouseover" in meinen Code integrieren? Muss ich ihn von Grund auf erneuern?!

    Vielen Dank für eure Hilfe!

    Gruss,
    Domi


    HTML-Code:
    <HEAD>
            <TITLE></TITLE>
        </HEAD>
        <BODY class="">
            <P><IMG style="WIDTH: 450px; HEIGHT: 516px" alt=NoReference src="/de/leben/aktuariat/PublishingImages/original_zusatz.png" useMap=#Reference border=0> </P>
            <P><MAP id=Reference name=Reference>
            <AREA shape=RECT coords=286,3,447,77 href="http://prod.intranet/de/leben/aktuariat/produktinfos/Seiten/default.aspx">
            <AREA shape=RECT coords=284,159,447,240 href="http://prod.intranet/de/leben/aktuariat/prozesse/Seiten/default.aspx">
            <AREA shape=RECT coords=3,161,144,237 href="http://prod.intranet/de/leben/aktuariat/kennzahlen/Seiten/default.aspx">
            <AREA shape=RECT coords=285,84,449,156 href="http://prod.intranet/de/leben/aktuariat/regelungen/Seiten/default.aspx">
            <AREA shape=RECT coords=3,243,144,318 href="http://prod.intranet/de/leben/aktuariat/fachwissen/Seiten/default.aspx">
            <AREA shape=RECT coords=1,82,144,154 href="http://prod.intranet/de/leben/aktuariat/partner/Seiten/default.aspx">
            <AREA shape=RECT coords=150,3,278,77 href="http://prod.intranet/de/leben/aktuariat/witz/Seiten/default.aspx">
            <AREA shape=RECT coords=149,163,151,165 href="" ??>
            <AREA shape=RECT coords=3,322,449,513></MAP></P>
        </BODY> 
    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 !!!!!

  2. #2
    Bandit
    Gast

    Standard AW: event-handler onmouseover

    Aus SelfHTML:
    Damit beim Überfahren einer verweis-sensitiven Fläche mit der Maus ein kleines Info-Fenster ("Tooltip") erscheint, können Sie in jeweils das Universalattribut title="angezeigter Text" verwenden.

  3. #3
    Unregistriert
    Gast

    Standard AW: event-handler onmouseover

    Hallo Bandit,

    Danke, dass du dich meiner angenommen hast.

    Allerdings ist das Tooltip nicht genau das was ich suche!
    Eher etwas der Form:

    http://www.on-mouseover.de/mouseoverframe/index.html (Beispiel 1)

    Ich bin aber ratlos, wie ich dies in meinem Code umsetzen kann.

    Gruss,
    Domi

  4. #4
    Meister(in) Avatar von goldeneye
    Registriert seit
    07.06.2008
    Ort
    Oberfranken
    Alter
    24
    Beiträge
    312
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: event-handler onmouseover

    Hey,

    ich hab mal schnell einen kleinen Code zusammengeschrieben, der dir zeigen sollte, welches Prinzip dahinter steckt:

    Code:
    <html>
    <head>
    	<title></title>
    </head>
    <body>
    
    	<div id="anzeige" style="visibility:hidden;">Test</div>
        
        <a href="http://www.google.de" onmouseover="document.getElementById('anzeige').style.visibility = 'visible'" onmouseout="document.getElementById('anzeige').style.visibility = 'hidden'">Hier drüber fahren!</a>
    
    </body>
    </html>
    Meinst du, dass du es nun auf deinen Code übertragen kannst?

  5. #5
    Unregistriert
    Gast

    Standard AW: event-handler onmouseover

    Hallo,

    Danke, das gibt mir neue Ideen.
    Ich komme der Sache immer näher.
    Es ist ja auch sinnvoller, wenn ichs alleine rausbekommen!

    Es ist nun aber so, dass ich areas definiert habe, die eine bestimmte Grösse und einen bestimmten Platz (definiert über den Namen) haben.
    Kann ich "onmouseover" (so wie du es mir gezeigt hast) auch darin ausführen???
    Du hast ja jetz <div> gebraucht.
    Ich möchte eben, dass der Text (bei dir heisst er "Test") an einem bestimmten Ort, in einer bestimmten area auftaucht und nicht nur "oberhalb des Links".

    Z.B. lautet eine Area, die auch als Link funktioniert:

    <AREA shape=RECT coords=286,3,447,77 href="http://prod.intranet/de/leben/aktuariat/produktinfos/Seiten/default.aspx">

    Ich möchte nun, dass, wenn ich über diesen Link, diese Area fahre, dass mir in der Area
    <AREA shape=RECT coords=3,322,449,513> der Text "Zusammenfassung Seite Prodinfos" ausgegeben wird!!!

    Wie mache ich denn das?! Das ist ja nicht genau das gleiche!

    Gruss,
    Domi

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: event-handler onmouseover

    das bild mit der areamap setzte in nen umschliesendes div (was position:relative; bekommt)
    dann machste dein div was da als info auftauchen soll mit da rein und setzt die visibility auf hidden oder das display auf none und position auf relative oder absolute, musste ma testen- relative sollte an sich schon fruchten.
    das umschliessende div bekommt nen z-index:0 und die info nen z-index:1

    dann brauchste ne funktion, die die entsprechende position der info setzt und des display auf visible bzw display auf block setzt.

    die eventhandler kannste entweder direkt ins area-tag schreiben oder mit jquery und IDs
    was du da vorhast is nich soo schwer!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  7. #7
    Unregistriert
    Gast

    Standard AW: event-handler onmouseover

    Hallo,

    Ich muss dir leider sagen, dass ich gerade nur Bahnhof verstehe, da ich html- technisch nicht so versiert bin, wie du denkst.

    Es würde mir einiges helfen, wenn du z.B. für eine meiner Areas das, was du mir da vorschlägst, einen Beispielcode generieren könnstest. Dann kann ich es für die anderen Areas genau gleich umsetzen und lerne noch was dabei!

    Vielen herzlichen Dank..

    Gruss,
    Domi

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: event-handler onmouseover

    wenn du die komplette url von dem bild rausrückst kann ich da gerne mal gucken...
    hab jetzt eh vor für jemanden hier aus dem forum ein script anzupassen.
    da kann ich auch gerne mal nach deinem kram gucken.

    haste glück, an sich will ich mehr eigeninitiative sehen, bevor ich für jemanden nen code schreibe, aber hab heut nen guten tag

    edit: dat warten dauert mir zu lange...

    hier is nen code, anpassen muste die positionen wo die infos auftauchen sollen und die texte die als info erscheinen sollen..

    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de">
    <head>
    <script type="text/javascript">
    function infoMe(infoindex){
    var target = document.getElementById("infodiv");
        var infos = new Array();
        infos[0]="erste info";
        infos[1]="zweite info";
        infos[2]="... info";
        infos[3]="... info";
        infos[4]="... info";
        infos[5]="... info";
        infos[6]="... info";
        infos[7]="... info";
        infos[8]="... info";
    
        var positions = new Array();
        positions[0] = "10px-20px";
        positions[1] = "100px-200px";
        positions[2] = "50px-70px";
        positions[3] = "40px-20px";
        positions[4] = "140px-240px";
        positions[5] = "10px-24px";
        positions[6] = "10px-244px";
        positions[7] = "40px-440px";
        positions[8] = "10px-20px";
        
        target.innerHTML = infos[infoindex];
        target.style.top = positions[infoindex].substring(0, positions[infoindex].indexOf("-") );
        target.style.left = positions[infoindex].substring(positions[infoindex].indexOf("-")+1, positions[infoindex].length );
        target.style.display = "block";
    
    
    }
    
    function hideMe(){
        var target = document.getElementById("infodiv");
        target.innerHTML ="";
        target.style.display = "none";
    }
    </script>
    </head>
    <body>
    <p style="position:relative;z-index:0;">
    <div id="infodiv" style="disply:none; position:absolute; z-index:1; background:#ffffff; padding:5px;"></div>
        <img style="WIDTH: 450px; HEIGHT: 516px" alt="NoReference" title="NoReference" src="http://forenpics.kaninchenrettung.de/privat/Einzugrudi/DSCF1254.JPG" usemap=#Reference border=0> 
    </p>
    <p>
        <map id=Reference name=Reference>
            <area shape=RECT coords=286,3,447,77 href="http://prod.intranet/de/leben/aktuariat/produktinfos/Seiten/default.aspx" onmouseover="infoMe('0');" onmouseout="hideMe();" >
            <area shape=RECT coords=284,159,447,240 href="http://prod.intranet/de/leben/aktuariat/prozesse/Seiten/default.aspx" onmouseover="infoMe('1');" onmouseout="hideMe();">
            <area shape=RECT coords=3,161,144,237 href="http://prod.intranet/de/leben/aktuariat/kennzahlen/Seiten/default.aspx" onmouseover="infoMe('2');" onmouseout="hideMe();">
            <area shape=RECT coords=285,84,449,156 href="http://prod.intranet/de/leben/aktuariat/regelungen/Seiten/default.aspx" onmouseover="infoMe('3');" onmouseout="hideMe();">
            <area shape=RECT coords=3,243,144,318 href="http://prod.intranet/de/leben/aktuariat/fachwissen/Seiten/default.aspx" onmouseover="infoMe('4');" onmouseout="hideMe();">
            <area shape=RECT coords=1,82,144,154 href="http://prod.intranet/de/leben/aktuariat/partner/Seiten/default.aspx" onmouseover="infoMe('5');" onmouseout="hideMe();">
            <area shape=RECT coords=150,3,278,77 href="http://prod.intranet/de/leben/aktuariat/witz/Seiten/default.aspx" onmouseover="infoMe('6');" onmouseout="hideMe();">
            <area shape=RECT coords=149,163,151,165 href="" onmouseover="infoMe('7');" onmouseout="hideMe();">
            <area shape=RECT coords=3,322,449,513 onmouseover="infoMe('8');" onmouseout="hideMe();">
        </map>
    </p>
    
    </body>
    </html>
    und weil ich stinkefaul bin hab ich die styles nich ausgelagert und den javascript-kram nich mit jquery gemacht(was codezeilen gespart hätt, aber ggf länger gedauert hätt)

    und für die zukunft: wenn du sachen haben willst, die du nicht kannst oder kennst, is es an der zeit sich mit der entsprechenden materie zu beschäftigen! und nich nur zu sagen: ich kann das nich!

    ich kann das nicht heisst übersetzt ich hab keine lust das zu lernen oder ich will das nicht
    Geändert von synaptic (24.11.2009 um 21:34 Uhr)
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  9. #9
    Unregistriert
    Gast

    Standard AW: event-handler onmouseover

    Hallo Synaptic,

    Ich danke dir herzlich für deine getane Arbeit für mich.

    Zu deinen Bemerkungen:

    Du hast natürlich das Recht mehr Eigeninitiative zu sehen.
    Nun ist es aber nicht so, dass ich GAR nichts vorzuweisen hatte.

    Allerdings musst du dir auch eingestehen, dass du nicht dazu verpflichtet bist, mir zu helfen. Wenn du es dann trotzdem tust, worüber ich dir sehr dankbar bin, darfst du dich meines erachtens nicht beklagen. Ausserdem ist doch ein Forum genau für Personen wie mich da, die an einen Punkt gelangt sin, an dem sie an ihre fachlichen Grenzen stossen.
    Das Argument, dass ich mich mehr einarbeiten soll verstehe ich schon, nur erlauben es meine Arbeitszeiten und -umstände leider nicht. Dies näher zu erläutern erachte ich als Rechtfertigung meinerseits und insofern als nicht notwendig an dieser Stelle.

    Es bleibt zu bemerken, dass ich genau das meine was ich sage oder schreibe. "Ich kann das nicht" bedeutet genau das was es aussagt, nicht mehr, nicht weniger.

    Als letztes wollte ich dir noch sagen, dass dein Code mit einigen kleinen Anpassungen meinerseits funktioniert.

    Grüsse,
    Domi

Ähnliche Themen

  1. Javascript back event
    Von SpeedFire im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 4
    Letzter Beitrag: 15.02.2009, 12:07
  2. ConflictError in event-log (zope)
    Von zopemin im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 6
    Letzter Beitrag: 21.06.2007, 21:16
  3. Event-Magazin.com
    Von event-magazin im Forum Eure Homepages und Foren - Vorstellung und Bewertungen
    Antworten: 13
    Letzter Beitrag: 22.04.2007, 19:50
  4. Imagemap auf nen mouseover event
    Von Fuzzle im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 20.03.2007, 10:50
  5. Event Community
    Von extr3m0 im Forum Eure Homepages und Foren - Vorstellung und Bewertungen
    Antworten: 2
    Letzter Beitrag: 21.02.2007, 17:36

Stichworte

Berechtigungen

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