1. Liebe Forumsgemeinde,

    aufgrund der Bestimmungen, die sich aus der DSGVO ergeben, müssten umfangreiche Anpassungen am Forum vorgenommen werden, die sich für uns nicht wirtschaftlich abbilden lassen. Daher haben wir uns entschlossen, das Forum in seiner aktuellen Form zu archivieren und online bereit zu stellen, jedoch keine Neuanmeldungen oder neuen Kommentare mehr zuzulassen. So ist sichergestellt, dass das gesammelte Wissen nicht verloren geht, und wir die Seite dennoch DSGVO-konform zur Verfügung stellen können.
    Dies wird in den nächsten Tagen umgesetzt.

    Ich danke allen, die sich in den letzten Jahren für Hilfesuchende und auch für das Forum selbst engagiert haben. Ich bin weiterhin für euch erreichbar unter tti(bei)pcwelt.de.
    Dismiss Notice

roll over bild

Discussion in 'Web-Know-how für die Homepage' started by mannyk, Mar 28, 2004.

Thread Status:
Not open for further replies.
  1. mannyk

    mannyk Halbes Megabyte

    Hi!
    Ich wüsste gerne, wie man es schafft, dass ein Hintergrundbild einer Tabelle sich ändert, wenn man mit der Maus über die Tabelle fährt.
    mfg,
    mannyk
     
    mannyk, Mar 28, 2004
    #1
  2. mannyk

    mannyk Halbes Megabyte

    Ok, jetzt klappts!
    Habe einfach noch 'onMouseout="goover1()"' in den table-tag gesetzt, wobei bei goover1 das anfangsbild steht.

    Danke für deine Hilfe!

    mfg,
    mannyk
     
    mannyk, Mar 29, 2004
    #2
  3. Gast

    Gast Guest

    ach stimmt.... der bindestrich wird bei javascript als minus eingesetzt....

    den funktionsaufruf kannste auch mit onMouseOver machen...

    z.b.
    <p onMouseOver="changetab()">test... blah. etc</p>


    als preload empfehle ich bei selfhtml unter javascript anwendungsbeispiele buttons zu sehen, dort ist ein script für dyanmische buttons
     
    Gast, Mar 29, 2004
    #3
  4. gerald_b

    gerald_b Kbyte

    Hi,


    'goover' ist der Name der aufzurufenden Funktion und dieser ist beliebig wählbar. Ich habe den einfach so genannt.

    Der Bildwechsel bei berühren der Tabelle sollte geschehen, wenn man - wie bereits gepostet - das TABLE-Tag um die Funktion onMouseover="goover()" ergänzt.


    Die Funktion goover könnte also so aussehen:

    function goover()
    {
    document.getElementById("tabelle").style.backgroundImage="url(bild1.jpg)";
    }

    getestet hab' ich das nicht; ein reload() könnte zur Erneuerung der Darstellung evtl. noch vonnöten sein...


    Das 'onload' im BODY-Tag besagt nur, dass beim Laden der Seite die nach onload angegebene Funktion ausgeführt wird. Da könnte z.B. eine Fenstergrößenanpassung drinstehen.


    mfg

    Gerald
     
    gerald_b, Mar 29, 2004
    #4
  5. mannyk

    mannyk Halbes Megabyte

    @ gerald_b:
    danke nochmals. Jetzt ist es so, dass das Bild in der Tabelle geändert wird, sobald man drauf zeigt - genau was ich wollte.
    Allerdings kommt nicht wieder das erste bild, wenn man mit dem Zeiger weggeht.

    mfg,
    mannyk
     
    mannyk, Mar 29, 2004
    #5
  6. mannyk

    mannyk Halbes Megabyte

    @gerald_b: Danke schonmal für das Script. Kannst du es noch etwas genauer angeben? Mit dem Code für den Bilderwechsel.
    Auf Selfhtml habe nichts gefunden zu goover gefunden und auch sonst nicht im web.

    @Michael_x:
    Habe das Script ausprobiert, aber es funzt nicht (nur Fehlersymbol in der IE Statusleiste). Außerdem wäre es für mich noch sinnvoller, wenn sich das Bild bei Berühren der Tabelle ändern würde und nicht bei Berühren eines Links.

    kann man das nicht mit onload im body-tag preloaden?

    mfg,
    mannyk
     
    mannyk, Mar 29, 2004
    #6
  7. gerald_b

    gerald_b Kbyte

    evtl. ist da noch ein kleiner Schreibfehler drin, statt

    document.getElementById("tabelle").style.background-image ="url(bild1.jpg)"

    könnte es

    document.getElementById("tabelle").style.backgroundImage="url(bild1.jpg)"

    heißen; Javascript ist da etwas penibel...
     
    gerald_b, Mar 29, 2004
    #7
  8. Gast

    Gast Guest

    versuchs mal so
    <script>
    function changetab()
    {
    document.getElementById("tabelle").style.background-image ="url(bild1.jpg)"
    }
    </script>
    <table style="background-image:url(bild.jpg)" id="tabelle">
    <tr>
    <td>...</td>
    </tr>
    </table>

    <a href="javascript:changetab()">Test</a>

    habs noch nicht getestet.
    aber so in etwa sollte man das hintergrundbild ändern können.
    allerdings hat dies script auch einen nachteil! die grafik wird erst dann geladen, wenn sie eingesetzt wird. bei l
    langsamen verbindungen dauert es....
     
    Gast, Mar 29, 2004
    #8
  9. gerald_b

    gerald_b Kbyte

    Hi,

    innerhalb des TABLE-Tags fügst Du

    onMouseover="goover()" id="Tabelle"

    ein, wobei 'goover' als Funktion eingebaut wird, z.B.

    <HEAD>
    <SCRIPT type="text/javascript">
    <!--
    function goover()
    {
    ... hier muss der Code für den Bildwechsel rein, evtl. mit

    document.getElementById("Tabelle")

    das Objekt besorgen und dann das Hintergrundbild verändern;

    Beispiel für die Änderung der Rahmenfarbe:

    document.getElementById("Tabelle").style.border="thin solid red";
    }
    //-->
    </SCRIPT>


    Hoffentlich hilft's


    Gerald
     
    gerald_b, Mar 29, 2004
    #9
  10. mannyk

    mannyk Halbes Megabyte

    Hi!
    vermutlich ja. Das Problem bei mir ist der Syntax, wie ich die Roll over Geschichte in den Table-Tag krieg, dass sich das Hintergrundbild 'bild.jpg' zu 'bild1.jpg' ändert.

    Also wohl irgendwo hierrein :)


    • <table width="100" border="0" cellspacing="0" cellpadding="0" background="bild.jpg">
      <tr>
      <td>&nbsp;</td>
      </tr>
      </table>

    mfg,
    manny
     
    mannyk, Mar 29, 2004
    #10
  11. gerald_b

    gerald_b Kbyte

    gerald_b, Mar 29, 2004
    #11
Thread Status:
Not open for further replies.

Share This Page