[JavaScript] Einfaches rollover?!?

Dieses Thema im Forum "Webentwicklung" wurde erstellt von My-Doom, 2. Dezember 2007 .

Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen
  1. #1 2. Dezember 2007
    Einfaches rollover?!?

    Hilfe,
    ich glaub ich dreh gleich am Rad :>
    ich will ein einfaches JS (von mir aus auch css..) rollover-bild haben.
    Habe home.jpg und home1.jpg. Bei mousover soll aus home.jpg, home1.jpg werden. Hab jetz ne gute virtelstunde gesucht :/ nüchts von dem drecks code geht..

    über ein einfaches beispiel wäre ich seehr dankbar :rolleyes:
     

  2. Anzeige
  3. #2 2. Dezember 2007
    AW: Einfaches rollover?!?

    Machs per CSS

    Code:
    .button1 { 
    background:url(bild.jpg) no-repeat; 
    width:200px;
    height:20px;
    }
    .button1:hover {
    background:url(bild_hover.jpg) no-repeat;
    }
    
    Allgemein aber am besten HTML uns CSS lernen.
     
  4. #3 2. Dezember 2007
    AW: Einfaches rollover?!?

    die html basics hab ich ja soweit. Nur gegen css wehr' ich mich noch etwas..
    Wohin pack ich den code? Ein paar mehr infos bitte noch..
    Ich würde das ganze gerne mit nem kompletten menü machen - quasi daa Homepage by Daniel :>
     
  5. #4 2. Dezember 2007
    AW: Einfaches rollover?!?

    Die Pseudo-Klasse "Hover" wird auf dem Browsermarkt bisher nicht ausreichend unterstützt, weswegen dieses Vorhaben nur wirklich mit Links zuverläßig funktioniert.

    Ansonsten kann ich dir nicht glauben, dass du schon ausreichend probiert und gegoogelt hast weil ein Konstrukt von "onmouseover" - "onmouseout" - "this.src" (o.Ä) .... hat nichts mit "Coder"- oder "Google-Skills" zu tun sondern mit Lesen,Abtippen,fertig ....
     
  6. #5 2. Dezember 2007
    AW: Einfaches rollover?!?

    es geht nicht! :/
    kann js vlt nich mit .jpg umgehen?
    Code:
    <html>
    <head><title>Homepage by Daniel</title>
    <script language="JavaScript">
    <!--
    // PRELOADING IMAGES
    if (document.images) {
     img_on =new Image(); img_on.src ="home1.jpg"; 
     img_off=new Image(); img_off.src="home.jpg"; 
    }
    function handleOver() { 
     if (document.images) document.imgName.src=img_on.src;
    }
    
    function handleOut() {
     if (document.images) document.imgName.src=img_off.src;
    }
    
    //-->
    </script>
    </head>
    <body bgcolor="black" vlink="EE0000" alink="ED00AD"><font color="FFFFFF">
    <center>
    <img src="dingens.bmp"><br />
    
    <a href="index.html"
    onMouseOver="handleOver();return true;" 
    onMouseOut="handleOut();return true;">
    <img name="Home" border=0 alt="Home" src="home.jpg"></a>
    
    <a href="about.htm">
    <img src="about.jpg" border="0" name="about"></a>
    <p>
    ...
    
     
  7. #6 2. Dezember 2007
    AW: Einfaches rollover?!?

    "Bei mousover soll aus home.jpg, home1.jpg werden"
    lässt ja darauf schließen das er es auf Links anweden will.

    Da du funpic benutzt...
    Namen von Datein immer klein schreiben !

    Ohne mir den Rest anzugucken würd ich sagen das es dadran liegt, hatte das Problem auch häufig bei funpic

    /e:
    Der CSS code muss innerhalb von <style></style> stehen, welches wiederrum im head sein muss.
    oder du machst ne externe CSS-Datei um den Code "sauber" zu halten.

    per: <link href="file.css" rel="stylesheet" type="text/css" /> (im head)
     
  8. #7 2. Dezember 2007
    AW: Einfaches rollover?!?

    nene.. hab ich zuvor auch schon probiert gehabt.. is nu alles lowercase, funktionieren tut es trotzdem noch nicht =(

    und wie binde ich den spaß im body bereich ein?
    nehmts mir nicht übel, aber grade wenig zeit..
     

  9. Videos zum Thema
Die Seite wird geladen...
Similar Threads - JavaScript Einfaches rollover
  1. Antworten:
    0
    Aufrufe:
    3.557
  2. Antworten:
    6
    Aufrufe:
    2.795
  3. Antworten:
    2
    Aufrufe:
    858
  4. JavaScript Cookie Manager

    leex , 4. September 2015 , im Forum: Webentwicklung
    Antworten:
    2
    Aufrufe:
    1.120
  5. Antworten:
    9
    Aufrufe:
    1.256