nicht angemeldet
mouseover funktion geht nicht richtig
0 
Gunnar Bittersmann
0 0 Gunnar Bittersmann
0 0 0 0 0 0 0 0 0 0 0 
Der Martin
0
0
0 0 Gunnar Bittersmann
mouseover funktion geht nicht richtig
Hi,
Ich habe mir zwei Funktionen gemacht eine die einen
Rahmen um das Bild macht und eine die den beim Runtergehen
wieder wegmacht.
Am Anfang ging es ja, aber jetzt wo ich mit Namensübergabe des
Bildes was gemacht hat geht es nicht mehr, wieso?
Code von index.html:
<html>
<head>
<title></title>
<script src="script.js" type="text/javascript"></script>
</head>
<body>
<a href="#"><img name="bild" src="bild.jpg" border="0" onmouseover="over_pic(bild)" onmouseout="off_pic(bild)"></a>
</body>
</html>
code von script.js:
function over_pic(name)
{
document.+name+.border = "10";
}
function off_pic(name)
{
document.+name+.border = "0";
}
-
document.+name+.border = "10";
Justin,
Auf der linken Seite willst du ein Objekt ansprechen; das ist was völlig Andreres als ein String.http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id@title=getElementById() wäre dein Freund; in diesem Falle aber ein falscher, weil sich dein Vorhaben völlig ohne JavaScript ganz einfach mit CSS realisieren lässt.
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
»»http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id@title=getElementById() wäre dein Freund; in diesem Falle aber ein falscher, weil sich dein Vorhaben völlig ohne JavaScript ganz einfach mit CSS realisieren lässt.
Danke, aber wie geht das mit css? Und irgendwie geht das
getelementbyid(+name+) auch nicht.-
Danke, aber wie geht das mit css?
Und irgendwie geht das
getelementbyid(+name+) auch nicht.Wenn dir schon etwas farbiges Unterstrichenes angegeben wird, solltest du dessen Bedeutung erfassen und das dahinter Stehende auch lesen. Und nicht bloß denken „braun sieht schöner aus als blau“.
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
Also danke an alle,
ich habs nun mit css und dem folgenden style gelöst
[funktioniert in Firefox und IE]img.thumb {
width: 64px;
height: 64px;
border-width: 1px;
border-style: dashed;
border-color: #FFFFFF;
}img.thumb:hover {
width: 64px;
height: 64px;
border-width: 1px;
border-style: dashed;
border-color: #CCCCCC;
}-
Hallo,
img.thumb:hover {
[funktioniert in Firefox und IE]Huch? Mit welchem IE funktioniert das?
viele Grüße
Axel
-
Mit dem von Windows XP, ist glaube ich IE 6, oder?
Wieso, geht es bei dir nicht?-
Hallo Justin.
Mit dem von Windows XP, ist glaube ich IE 6, oder?
Wieso, geht es bei dir nicht?Bitte kopiere und füge bitte hier noch einmal 1:1 den Code ein, den du nun erzeugt hast.
Der IE kann die :hover-Pseudoklasse ohne Hilfe von J(ava)Script nur auf a-Elemente anwenden, die ein Link sind.
Einen schönen Samstag noch.
Gruß, Ashura
-
Bitte kopiere und füge bitte hier noch einmal 1:1 den Code ein, den du nun erzeugt hast.
Der IE kann die :hover-Pseudoklasse ohne Hilfe von J(ava)Script nur auf a-Elemente anwenden, die ein Link sind.
Ich hab jetzt kein js mehr drinne, aber es geht mit dem css.
habe den code doch schon gepostet gehabt, aber hier nochmal alles was ich für img an styles in meiner externen css drinhabe:img {
border-width: 0px;
border-style: dashed;
border-color: #CCCCCC;
}img.thumb {
width: 64px;
height: 64px;
border-width: 1px;
border-style: dashed;
border-color: #FFFFFF;
}img.thumb:hover {
width: 64px;
height: 64px;
border-width: 1px;
border-style: dashed;
border-color: #CCCCCC;
}und das hier steht fürs anzeigen in der html:
<a href="#"><img src="bild.gif" class="thumb"></a>
-
Geht es bei euch nicht mit img:hover ?
wenn ja, in keinem eurer browser oder nur bei IE nicht?
Welche version von IE habt ihr?
Das müsste ich ja dann schon wissen, falls ich das in meiner seite drinne lasse.-
Geht es bei euch nicht mit img:hover ?
wenn ja, in keinem eurer browser oder nur bei IE nicht?Es geht nur im IE nicht (und das ist ein bekanntes Problem).
Welche version von IE habt ihr?
ganz genau: 6.0.2900.2180.xpsp_sp2_gdr.050301-1519
Die :hover-Pseudoklasee funktioniert im IE bis einschließlich IE6 _nur_ mit dem a-Element.
Im IE7 (von dem es noch keine offizielle Version gibt) wird dieser Fehler behoben werden (wenn ich richtig informiert bin).-
Die :hover-Pseudoklasee funktioniert im IE bis einschließlich IE6 _nur_ mit dem a-Element.
Im IE7 (von dem es noch keine offizielle Version gibt) wird dieser Fehler behoben werden (wenn ich richtig informiert bin).Ich habe den ganz normalen IE ohne sp oder update etc. und
bei mir gehts. Es geht nur nicht wenn ich den border-width schon
bei img.thumb auf 0 stelle, wenns auf 1 ist gehts, weil ich hab
nen weisen Hintergrund dann sieht man den weisen Rahmen ja noch nicht, dann änder ich die farbe bei img:hover und man sieht den Rahmen.
jedenfalls klappts jetzt so, ist ja auch nicht schlimm wenn einer,
diesen Effekt drinne hat wenn er mit ie auf meine Seite geht.ps: wo ich gerade vom servicepack war, weis jemand ob grad ein
PC Magazin draußen ist mit dem SP2, da mir des mit isdn vieeel
zu lang dauert zum runterladen. Ich hab auch gehört dass es da probleme gibt mit
meinem amd athlon 64, der soll mit sp2 immer runterfahren/abstürzen, stimmt dass?-
Hallo Justin.
jedenfalls klappts jetzt so, ist ja auch nicht schlimm wenn einer,
diesen Effekt drinne hat wenn er mit ie auf meine Seite geht.Ohne J(ava)Script *kann* es nicht funktionieren, darüber schimpfen wir (die Webgestaltert) schließlich schon seit Jahren.
Kannst du eine Beispielseite online stellen?
ps: wo ich gerade vom servicepack war, weis jemand ob grad ein
PC Magazin draußen ist mit dem SP2, da mir des mit isdn vieeel
zu lang dauert zum runterladen.Theoretisch hätte es genügt, einfach die automatischen Softwareupdates von Windows zu aktivieren.
Einen schönen Sonntag noch.
Gruß, Ashura
-
Ohne J(ava)Script *kann* es nicht funktionieren, darüber schimpfen wir (die Webgestaltert) schließlich schon seit Jahren.
Kannst du eine Beispielseite online stellen?Also bei mir gehts... hier mal die Seite
http://home.arcor.de/kenibu1987/tempsite/
Was mich jetzt noch stören würde, ist dass
der IE des .png net durchsichtig anzeigt,
zeigen dass noch mehr browser nicht richtig an?
Kann man das irgendwie lösen?Theoretisch hätte es genügt, einfach die automatischen Softwareupdates von Windows zu aktivieren.
Die Windows updates hab ich deaktiviert, weil ich mit isdn
das nicht haben will, dass da noch anderes meine geschw. bremst.
Auserdem. habe ich erst vor kurzem formatiert, dann müsste ich
jetzt auch wieder alles neu laden. Und wer weis was von dem gerücht,
dass amd athlon 64 bei SP2 abstürtzt?-
Hallo,
Also bei mir gehts... hier mal die Seite
http://home.arcor.de/kenibu1987/tempsite/Das einzige, was da "hovert", ist die Vertauschung von Vorder- und Hintergrundfarbe des a-Elements; das zeigt sich dadurch, dass der gestrichelte Rahmen einen Farbumschlag macht.
Was mich jetzt noch stören würde, ist dass
der IE des .png net durchsichtig anzeigt,
zeigen dass noch mehr browser nicht richtig an?Auch das ist eine bekannte Schwäche des IE. Halbtransparente PNGs kann er einfach nicht richtig interpretieren. Aber auch das soll angeblich mit dem IE7 endlich besser werden.
Kann man das irgendwie lösen?
Nicht wirklich. Es gibt einen Workaround, der über irgendeine alpha-Filter-Konstruktion was reißen soll. Hat aber den Nachteil, dass das eine proprietäre Lösung ist, die _nur_ der IE versteht, und das auch nur, wenn ActiveX zugelassen wird (nicht empfehlenswert).
Die Windows updates hab ich deaktiviert, weil ich mit isdn
das nicht haben will, dass da noch anderes meine geschw. bremst.Deswegen kannst du die Updates ja auch manuell anstoßen und dann zu einer Zeit, in der du sonst nichts am Rechner machst. Dann rödelt der halt mal ein Stündchen oder so. Du hast doch bei Arcor bestimmt eine Flatrate, oder? Na also, dann macht das doch nix.
Auserdem. habe ich erst vor kurzem formatiert, dann müsste ich
jetzt auch wieder alles neu laden.Deswegen immer schön die heruntergeladenen Daten speichern. Man weiß nie, wozu man sie nochmal braucht. Abgesehen davon könntest du ja auch ein paar Euro für eine PC-Zeitschrift ausgeben. Oft ist auf den beiliegenden CDs auch das SP2 für XP mit drauf. Vor dem Kauf mal ins Inhaltsverzeichnis schauen, und dann die passende aussuchen. Die meisten kosten nur so um die fünf Euro.
Und wer weis was von dem gerücht, dass amd athlon 64 bei SP2 abstürtzt?
Das ist mir neu; keine Ahnung.
Schönen Sonntag noch,
Martin--
Wer im Glashaus sitzt, sollte Spaß am Fensterputzen haben.
-
Das einzige, was da "hovert", ist die Vertauschung von Vorder- und Hintergrundfarbe des a-Elements; das zeigt sich dadurch, dass der gestrichelte Rahmen einen Farbumschlag macht.
ja, ich wollte es jetzt auch wieder mit JS machen,
aber irgendwie geht es damit nichtmehr.
Kannst du mir sagen was ich jetzt wieder falsch habe:script.js datei:
function over_pic(image)
{
image.height = "70px";
}function off_pic(image)
{
image.height = "64px";
}index.html datei:
<script src="script.js" type="text/javascript"></script><a href="#"><img src="bild.gif" class="thumb" onmouseover="over_pic(this)" onmouseout="off_pic(this)"></a>
[...] bei Arcor bestimmt eine Flatrate, oder?
Nein, für isdn gibts doch keine flat, oder?
Wir wollen ja eigentlich dsl flat, aber kriegens nicht
(nicht verfügbar). Wir haben max. 90std für jeden Monat
und die sind schon durchs normale Surfen aufgebraucht.[...] eine PC-Zeitschrift ausgeben. Oft ist auf den beiliegenden CDs auch das SP2 für XP mit drauf. [...]
Ja, das hab ich ja vorhin gefragt gehabt, ob jemand eine kennt wo
das SP2 gerade drinne ist.-
Hallo,
ja, ich wollte es jetzt auch wieder mit JS machen,
aber irgendwie geht es damit nichtmehr.image.height = "70px";
image.height = "64px";Lass hier mal die "px" weg. Maßeinheiten sind im CSS (und in style-Objekt in JS) zwar vorgeschrieben; in HTML-Attributen und den zugehörigen JS-Eigenschaften haben sie aber nichts verloren.
[...] bei Arcor bestimmt eine Flatrate, oder?
Nein, für isdn gibts doch keine flat, oder?Ich war mir da nicht sicher - ich dachte, bei Arcor gäb's die noch.
Wir wollen ja eigentlich dsl flat, aber kriegens nicht (nicht verfügbar).
Ah, dann wohnst du wohl etwas abgelegen in der Pampa? ;-)
[...] eine PC-Zeitschrift ausgeben. Oft ist auf den beiliegenden CDs auch das SP2 für XP mit drauf. [...]
Ja, das hab ich ja vorhin gefragt gehabt, ob jemand eine kennt wo
das SP2 gerade drinne ist.Nö, einen konkreten Tipp habe ich nicht. Aber ein Blick ins Regal beim Zeitschriftenhändler hilft. :-)
Schönen Sonntag noch,
Martin--
Denken ist wohl die schwerste Arbeit, die es gibt. Deshalb beschäftigen sich auch nur wenige damit.
(Henry Ford, amerikanischer Industriepionier)
-
Lass hier mal die "px" weg. Maßeinheiten sind im CSS (und in style-Objekt in JS) zwar vorgeschrieben; in HTML-Attributen und den zugehörigen JS-Eigenschaften haben sie aber nichts verloren.
das bringt auch nix. Was jetzt?
Ah, dann wohnst du wohl etwas abgelegen in der Pampa? ;-)
Ja, aber der Nachbar 2 Häuser weiter hat dsl flat und andere im dorf auch,
telekom sagt uns immer wieder, dass es nicht geht und dass Sie
irgendwann ausbauen etc. - blabla...-
Hi,
das bringt auch nix. Was jetzt?
mache es wie vorgeschlagen mit CSS. Du solltest ja jetzt wissen, worauf Du achten mußt, damit es auch im IE funktioniert.
freundliche Grüße
Ingo-
mache es wie vorgeschlagen mit CSS. Du solltest ja jetzt wissen, worauf Du achten mußt, damit es auch im IE funktioniert.
Ja, ich werds jetzt nochmal mit css versuchen, das
javascript funktioniert jetzt aber auch,
habe im style größe angegeben gehabt, deshalb
musste ich image.style.height machen.
Danke-
Hallo Justin.
[…]
habe im style größe angegeben gehabt, deshalb
musste ich image.style.height machen.Dann aber *mit* Maßeinheit, da dies nicht mehr HTML sondern CSS ist.
Einen schönen Sonntag noch.
Gruß, Ashura
-
Dann aber *mit* Maßeinheit, da dies nicht mehr HTML sondern CSS ist.
Ja, hab ich, so siehts jetzt in meinem style.css aus:
a img.thumb {
border-width: 0px;
margin: 3px;
width: 64px;
height: 64px;
}
a:link img.thumb, a:visited img.thumb {
border-width: 0px;
margin: 3px;
width: 64px;
height: 64px;
}
a:hover img.thumb {
border-width: 0px;
margin: 0px;
width: 70px;
height: 70px;
}so im index.html:
<a href="#"><img src="bild.gif" class="thumb"></a>Und so klappts super ohne javascript, jetzt will ich nurnoch irgendwas
gegen den bug in IE bei .png machen. Hat jemand ne Idee wie man den
Hintergrund bei meinem Inhaltsfenster und linkfenster
durchsichtig machen kann? [bei Firefox geht des .png ja, aber nich bei IE]-
Hallo Justin.
Hat jemand ne Idee wie man den
Hintergrund bei meinem Inhaltsfenster und linkfenster
durchsichtig machen kann? [bei Firefox geht des .png ja, aber nich bei IE]Martin hat dir bereits alle Möglichkeiten genannt.
Einen schönen Sonntag noch.
Gruß, Ashura
-
-
-
habe im style größe angegeben gehabt, deshalb
musste ich image.style.height machen.Du kannst das zwar über das style-Objekt regeln, musst es aber nicht. So wie du es zuerst machen wollteset, geht es auch.
Es funktioniert so:
image.style.height="70px";<- ein Stringoder so:
image.height=70;<- ein Integer
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Hallo,
Danke, aber wie geht das mit css? Und irgendwie geht das
getelementbyid(+name+) auch nicht.1. getElementById() ist Case-sensitiv
2. du musst doch das + weglassen! Welchen String magst du denn verknüpfen????werbeklaus
-
-
-
Hi!
Wenn du das ganze schon über JavaScript regeln willst, dann würde ich das so machen:
<a href="#"><img src="bild.jpg" border="0" onmouseover="over_pic(this)" onmouseout="off_pic(this)"></a>und das Script: function over_pic(image) { image.border=10; } function off_pic(image) { image.border=0; }Ich würde dir aber zur CSS Pseudo-Klasse http://de.selfhtml.org/css/formate/zentrale.htm#pseudoformate@title=:hover raten (und diese nicht auf das Bild sondern auf den <a>-Link beziehen, damit das auch im IE funktioniert).
-
<a href="#"><img src="bild.jpg" border="0" onmouseover="over_pic(this)" onmouseout="off_pic(this)"></a>
[...]
Ich würde dir aber zur CSS Pseudo-Klasse http://de.selfhtml.org/css/formate/zentrale.htm#pseudoformate@title=:hover raten (und diese nicht auf das Bild sondern auf den <a>-Link beziehen, damit das auch im IE funktioniert).Ok, danke funktioniert.
-
-
Ich habe mir zwei Funktionen gemacht eine die einen
Rahmen um das Bild macht und eine die den beim Runtergehen
wieder wegmacht.Justin,
Das geht ohne JavaScript mit CSS.<a href="#"><img name="bild" src="bild.jpg" border="0" onmouseover="over_pic(bild)" onmouseout="off_pic(bild)"></a>
Also weg mit onmouseover und onmouseout. border kommt ebenfalls weg; die Angabe wird auch mit CSS gemacht:
a img { border-width: 10px; } a:link img, a:visited img { border-color: transparent; } a:hover img { border-color: red; /* hier die gewünschte Farbe */ }Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
Hallo,
Das geht ohne JavaScript mit CSS.
richtig.
<a href="#"><img name="bild" src="bild.jpg" border="0" onmouseover="over_pic(bild)" onmouseout="off_pic(bild)"></a>
Also weg mit onmouseover und onmouseout. border kommt ebenfalls weg; die Angabe wird auch mit CSS gemacht:
a img {
border-width: 10px;
}
a:link img, a:visited img {
border-color: transparent;
}
a:hover img {
border-color: red; /* hier die gewünschte Farbe */
}Hm, wenn Du jemanden von CSS überzeugen willst, dann sollte das aber auch im IE funktionieren. Der hat hier gleich zwei Probleme. 1\. Der Selector "a:hover img" "zündet" nur, wenn es durch ein "a:hover" "getriggert" wurde. Man muss also irgendwas bei a:hover ändern, und wenn es nur das Wechseln einer Farbe von #FFF nach white ist. 2\. Bei einem IMG mit transparentem Rahmen in einem A scheint die color (nein, nicht die background-color ;-)) des A-Elements durch den transparenten Rahmen des DIV. Besser also: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Hover IMG im A</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> <!-- a:link, a:visited { color:#FFF; /\* hier die gewünschte Hintergrundfarbe angeben \*/ background-color:#FFF; /\* hier auch \*/ } a:hover { background-color:white; /\* Trigger für a:hover img ;-)\*/ } a img { border-width: 10px; } a:link img, a:visited img { border-color: transparent; } a:hover img { border-color: red; } \--> </style> </head> <body> <p><a href="#"><img name="bild" src="Beispiel.jpg"></a></p> </body> </html> viele Grüße Axel
-