• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Allgemeine Frage zum onclick

P

psteimann

New member
Hallo Zusammen,

Ich habe ein Bild mit einem Mousover. Nun möchte ich beim Click auf das Bild einen script auslösen, also sowas wie ein weietres href bzw. onclick. Wo häng ich das wie rein? ein 2tes <a href geht ja nicht...

HTML: 
<td height="93" style="text-align: center; vertical-align: middle; background-color: rgb(0, 0, 0); width:55px;"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Fingerprint','','images/simulation/Actatek3_Fingerprint2b.jpg',1)"><img src="http://forum.jswelt.de/images/simulation/Actatek3_Fingerprintb.jpg" width="102" height="135"  id="Fingerprint" /></a>
                          </td>

Gruss und Danke

Peter
 
Zuletzt bearbeitet von einem Moderator:
AW: Onouseover soll beim Klicken einen Script starten

Bisher sehe ich da noch kein onclick. Aber selbst wenn, man könnte das in die Anführungszeichen durch Semikolon getrennt hinten dran hängen. Oder man ruft aus Script 1 das andere auf.
 
AW: Onouseover soll beim Klicken einen Script starten

Das zusätzliche a ist sinnfrei, vor allem href="#":
HTML: 
<td height="93" style="text-align: center; vertical-align: middle; background-color: rgb(0, 0, 0); width:55px;">
   <img src="http://forum.jswelt.de/images/simulation/Actatek3_Fingerprintb.jpg" width="102" height="135" id="Fingerprint" onmouseout="MM_swapImgRestore();" onmouseover="MM_swapImage('Fingerprint','','images/simulation/Actatek3_Fingerprint2b.jpg',1);" onclick="doSomething();">
</td>
PS: eine vernünftige Code-Einrückung macht das Ganze besser lesbar, auch bei solch kleinen Code-Schnipseln.
 
AW: Onouseover soll beim Klicken einen Script starten

Julian, dann mach die Einrückung aber auch :)
HTML: 
<td
   height="93"
   style="text-align: center; vertical-align: middle; background-color: rgb(0, 0, 0); width:55px;"
>
   <img
      src="http://forum.jswelt.de/images/simulation/Actatek3_Fingerprintb.jpg"
      width="102"
      height="135"
      id="Fingerprint"
      onmouseout="MM_swapImgRestore();"
      onmouseover="MM_swapImage('Fingerprint','','images/simulation/Actatek3_Fingerprint2b.jpg',1);"
      onclick="doSomething();"
   >
</td>

Das ist jetzt übertrieben. Aber bei sehr langen Codewürsten (man weiß ja nie, wo das Forum abschneidet) und in Lernsituationen finde ich diese Anordnung weitaus übersichtlicher.
 
AW: Onouseover soll beim Klicken einen Script starten

Wollte nur sagen, irgendwie ist der Titel des Threads verwirrend.
"Onmouseover soll beim klicken..."

Onmouseover sagt "die Maus wird über etwas bewegt. Mit mouseover kann man beim klicken gar nichts machen, dafür ist onclick zuständig.

*nörgel- and besserwisser- mode is now disabled*
 
AW: Onouseover soll beim Klicken einen Script starten

dbarthel schrieb:
Wollte nur sagen, irgendwie ist der Titel des Threads verwirrend.
"Onmouseover soll beim klicken..."

Onmouseover sagt "die Maus wird über etwas bewegt. Mit mouseover kann man beim klicken gar nichts machen, dafür ist onclick zuständig.

*nörgel- and besserwisser- mode is now disabled*
Zum Vergrößern anklicken....

Hi,

Schon klar. Aber wa sprichtt dagegen, dass sich z.B. beim Mouseover das Bild ändert und man dann mittels onclick eine weitere Aktion ausführt?

Nun, ich hab mir die Antwort schon fast selbst gegeben. War wohl etwas spät gestern...

Forlendes Funktioniert:

Code: 
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Fingerprint','','images/simulation/Actatek3_Fingerprint2b.jpg',1)"><img src="http://forum.jswelt.de/images/simulation/Actatek3_Fingerprintb.jpg" width="102" height="135"  id="Fingerprint" onClick= "javascript:swap('bild02','images/simulation/Actatek3_Door_Open.jpg','1')"></a>
- - - Aktualisiert - - -

Nö. Im Gegenteil. Sieht gut aus. Werde mich bessern:)

- - - Aktualisiert - - -

Hi,

onClick war ne idee. Dass ich es so im Schnippsel verwenden kann, habe ich zwischenzeitlich selbst rausgefunden;.)

Danke

- - - Aktualisiert - - -

Was das ganze soll:

http://www.acatek.de/Actasim.html

Als Anfänger gefällt mir das ganz gut, komm aus einer ganz anderen Ecke. (Bauch rein, Brust raus:)
 
Zuletzt bearbeitet von einem Moderator:
mikdoe schrieb:
HTML: 
<td
   height="93"
   style="text-align: center; vertical-align: middle; background-color: rgb(0, 0, 0); width:55px;"
>
   <img
      src="http://forum.jswelt.de/images/simulation/Actatek3_Fingerprintb.jpg"
      width="102"
      height="135"
      id="Fingerprint"
      onmouseout="MM_swapImgRestore();"
      onmouseover="MM_swapImage('Fingerprint','','images/simulation/Actatek3_Fingerprint2b.jpg',1);"
      onclick="doSomething();"
   >
</td>

Das ist jetzt übertrieben.
Zum Vergrößern anklicken....
Ja ;)
Ne, du hast schon recht. Ich persönlich verwende diese Form der Einrückung eigentlich nie, da ich keine so langen Attribute habe. In den meisten Fällen (außer ein paar älteren Projekten) füge ich die Eventlistener per JS hinzu und versehe wie üblich Elemente mit CSS-Klassen statt inline-Styleangaben...
 
dbarthel schrieb:
Braucht man es nur einmal, gehts auch per Inline.
Zum Vergrößern anklicken....
Gehen ja aber macht das Sinn? Auch wenn ich da in der Vergangenheit selbst nicht so konsequent war würde ich zukünftig immer versuchen, für alles CSS Klassen zu definieren. Auch bei kleinen Sachen. Denn plötzlich werden sie größer und man hat ein Kuddelmuddel an Definitionen. Mal als Datei, mal als Inline CSS, mal als Inline Style, mal per JS zugewiesen und was es noch alles gibt. Es gibt doch nichts schlimmeres als so ein Durcheinander.

Und auch bei kleinen Sachen die klein bleiben einfach nur damit es an zentraler Stelle gepflegt und ggf. auch geändert werden kann, Stichwort indiv. Styles/Themes, untersch. Sprachen usw.
Und wenn wir ehrlich sind stellen wir sowieso fest, dass bei etwas größeren Projekten sowieso eine Sache so gut wie niemals nur einmal vorkommt ;)
 
Zuletzt bearbeitet:
dbarthel schrieb:
Obwohl CSS-Klassen ja eigentlich nur dann lohnen, wenn die selbe Formatierung wiederholt zum Einsatz kommt.
Braucht man es nur einmal, gehts auch per Inline.
Zum Vergrößern anklicken....

*bääääm* ... da ist er, euer Lieblingshühnerschrecker! Ich muss an dieser Stelle direkt intervenieren - sorry, bro! Aber: Die Verwendung von (zu vielen) externen Styles sowie Inline-Styles im body-Tag kann sich negativ auf die Performance durch das Rendering des Browsers auswirken. Denn: Der Browser blockiert die Website während er die externen Styles holt - trifft er nun auf "inline-css" (auch über <style> innerhalb des Dokumentes; trifft man häufig bei CMS, Shops usw.), löst dies durchaus einen "Reflow" bzw. "Shifting" aus (ich kenne es nur mit den beiden Begriffen; zum Verständnis: er fängt nochmal an bzw. verzögert weiter ...).

Ganz wichtig: Wenn es - wie in dem Beispiel oben und angenommen, es gäbe nur dieses eine Bild und auch nur diese eine TD-Zelle - um CSS geht, dann ist es als "embedded CSS" optimal aufgehoben - das gehört ausnahmslos für Performance und Usability (Zeit!) in den head ... das Beispiel erstreckt sich für oben also ausnahmslos auf den inline-CSS-Teil der TD-Zelle.

Hinweis: MM_swapRestore() und MM_swapImage() sind echte Fossile. Wenn ich mich richtig entsinne, sollen das Preloader sein - "MM" steht hierbei für "Macromedia", welche schon vor gefühlten Jahrzehnten von Adobe geschluckt wurden. Ich bin der Meinung, dass man hier durchaus eher mit Spriting/CSS weitermachen sollte, um einen Image-Swap (hover) zu produzieren (läd nur ein Bild und der Rest ist CSS über die background-position).
 
Allerdings programmieren die wenigsten Hennen mit dem Editor und die meisten Baukastensystem und Tools, wie VisualWeb und Co kommen nur selten auf die Idee CSS Dateien abzulegen.
 
Daher ist Programmieren auch weiterhin "Handarbeit" und als "Handwerk" zu verstehen. Und so lange das so ist, werden Foren wie diese gefüllt und man trifft weiterhin regelmäßig auf solche Beispiele. Hab also bitte Verständnis dafür, dass ich das nicht als "kann man machen" stehen lassen konnte ... bei großen Projekten ist das nämlich absolut nicht in Ordnung.
 
SteelWheel schrieb:
Hab also bitte Verständnis dafür, dass ich das nicht als "kann man machen" stehen lassen konnte ...
Zum Vergrößern anklicken....

Hast ja Recht... bist eben doch der beste Hühnerhabischt, den wir haben.
Ich persönlich benutze auch in 98% CSS Dateien, wollte nur erwähnt haben, das die Inline-Notierung durchaus auch im Produktibereich eingesetzt wird; und dies, meiner Meinung nach, auch ok ist, solange es eine Ausnahme ist, welche nicht zur Regel wird.
 
Schon klar. Aber ich lz.B. iebe Klassen. Auch Funktionen in extwernen Scripten. Machts einfach übersichtlicher und Aenderungen im Design gehen schneller, vor allem bei komplexen Projekten...

- - - Aktualisiert - - -

Hi,

Das funktioniert zwar. Nur Frage ich mich, warum mir bein W3c-Check gemeldet wird, dass onclick für dieses Ereignis nicht zulässig ist? Oder liegt's am W3C-Checker (Dreamwaver Vers.6)
 
psteimann schrieb:
Dreamwaver
Zum Vergrößern anklicken....
OMG... verwendest du den wirklich?

Verwende zum Validieren The W3C Markup Validation Service

PS: das "javascript:" im onclick ist komplett unnötig - weg damit. Auch das <a> ist komplett unnötig, aber das haben dir ja schon die Anderen gesagt.
PPS: [klugscheißmodus]Es heitß onclick mit kleinem "c".[/klugscheißmodus]

SteelWheel schrieb:
Wenn ich mich richtig entsinne, sollen das Preloader sein
Zum Vergrößern anklicken....
Da entsinnst du dich leider falsch. Diese beiden Funktionen ändern das src-Attribut eines <img> bzw. setzen das wieder zurück. Sind Funktionen von Dreamweaver.
 
Jaja, swap() ist Tausch - aber ich meine, der hat 'nen preload mit drin gehabt. Und wie gesagt: MM = Macromedia ... wirklich alt. ^^ (da darf ich das auch mal nicht mehr wissen) ^^
 
SteelWheel schrieb:
Jaja, swap() ist Tausch - aber ich meine, der hat 'nen preload mit drin gehabt. Und wie gesagt: MM = Macromedia ... wirklich alt. ^^ (da darf ich das auch mal nicht mehr wissen) ^^
Zum Vergrößern anklicken....

Naja, die aktuellen Traumwellen sind mit knapp 25 Teuro/Monat ja evtl. auch nicht ganz umsonst, insofern ist etwas Nostalgie nachvollziehbar, wenn auch nicht ratsam.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben