Grafik bei RollOver nicht taransparent

[Tetsh]

Tachien hier im Forum

ich hab mal ne Frage und zwar,

ich arbeite garde an einer Seite und jetzt habe ich ein problem und zwar will ich die Navi aus mehreren Bildern zusammensetzen und zwar so das alle Bilder zu ca.50% Transparent sidn aber wenn man mit der Maus über eins geht das dieses dann in ca. einer halben bis ganzen sekunde normal wird halt nicht durchsichtig.

falls jemand mich nicht versteht was ich gut verstehen kann
dann sage ich noch dazu das man so etwas oft bei den affilates sieht.halt eine art hover effect.

[Mathias Bigge]

Hi Tetsh,

ich arbeite garde an einer Seite und jetzt habe ich ein problem und zwar will ich die Navi aus mehreren Bildern zusammensetzen und zwar so das alle Bilder zu ca.50% Transparent sidn aber wenn man mit der Maus über eins geht das dieses dann in ca. einer halben bis ganzen sekunde normal wird halt nicht durchsichtig.

Sowas kannst Du per Rollover nur simulieren, indem Du das untere Bild im Grafikprogramm so produzierst, dass Du das obere halbtransparent darüber legst.

falls jemand mich nicht versteht was ich gut verstehen kann
dann sage ich noch dazu das man so etwas oft bei den affilates sieht.halt eine art hover effect.

Dort vielleicht Flash, auf der wertguten Mistseite, auf der man anfangen kann, Sexnummern zu verbimmeln? Oder meinst Du ne andere?

Viele Grüße
Mathias Bigge

[Tetsh]

Nein ich meine es anders.
Damals habe ich mit Dreamweaver gearbeitet und da konnte man eine Grafik einfügen(nicht transparent von grafik programm aus).nun konnte man einstellen das diese grafik wenn keine maus daraug ist zu ca.50 % transparent ist.Sobald man nun aber mit der Maus rüber geht wird sie nach einiger zeit(1sek)wieder normal und ist nicht transparent.
hier habe ich ein beispiel:

http://reflectlab.rm2kmania.de/main.php?design=2&show=news

so auf der linken seite das meine ich.
ich habe mir den quallcode noch einmal angeschaut und denke das es vielleicht mit java gemacht ist weil wenn ich es einfach kopiere und meine bilder statt diese einfüge steht im browser immer auf der seite wäre ein fehler und auf der seite wird java genutzt,glaube ich jedenfalls.

[Mathias Bigge]

Hi Tetsh,

reflectlab scheint was Browserspezifisches zu nutzen, im IE 5.5 funktioniert es nicht, dort erzeugt es nur 'nen Scriptfehler. Es gibt verschiedene browserspezifische Lösungen, dazu hast Du ja oben schon einen Hinweis.

http://reflectlab.rm2kmania.de/main.php?design=2&show=news

[....] java [....]

Javascript

Was spricht eigentlich gegen eine Lösung, wie ich sie Dir vorgeschlagen habe, hast Du kein Grafikprogramm? Du brauchst eins, das verschiedene Ebenen kann:

1. Beide Bilder laden.
2. Das obere Bild markieren und markieren.
3. Das untere Bild aktivieren.
4. Neue Ebene einfügen.
5. Das andere Bild einfügen.
6. Die Ebenentransparenz auf 50% setzen.
7. Das Mischbild unter neuem Namen abspeichern.
8. Das Rollover definieren.

Wenn Du das im Dreamweaver machst, kannst Du sogar automatisch einen dritten Zustand definieren, in dem das untere Bild komplett angezeigt wird.

Viele Grüße
Mathias Bigge

[Patrick]

Probier's doch mal damit:
http://www.planet-tutorials.de/phpforum/zeigethema.php?topicid=2149

PS: Ich hoffe, ich habe Dich richtig verstanden, und das hilft Dir weiter.

[Tetsh]

Probier's doch mal damit:
http://www.planet-tutorials.de/phpforum/zeigethema.php?topicid=2149

PS: Ich hoffe, ich habe Dich richtig verstanden, und das hilft Dir weiter.

nee mit hat das leider nicht gehofen kann mir nicht einfach vielleicht jemand den code hier rein schreiben?

[Thomas Meinike]

Hallo,

ich arbeite garde an einer Seite und jetzt habe ich ein problem und zwar will ich die Navi aus mehreren Bildern zusammensetzen und zwar so das alle Bilder zu ca.50% Transparent sidn aber wenn man mit der Maus über eins geht das dieses dann in ca. einer halben bis ganzen sekunde normal wird halt nicht durchsichtig.

Fuer Mozilla hilft einfach das:

img
{
  -moz-opacity: 0.5;
}

img:hover
{
  -moz-opacity: 1.0;
}

Im IE gibt es den opacity-Filter. Ansonsten waeren hier Grafik-Rollovers angebracht (Bildertausch).

Prima machbar ist das auch mit SVG:

<image xlink:href="abc.gif" x="..." y="..." width="..." height="..." style="opacity: 0.5">
  <set attributeName="opacity" attributeType="CSS" to="1.0" begin="mouseover"/>
  <set attributeName="opacity" attributeType="CSS" to="0.5" begin="mouseout"/>
</image>

MfG, Thomas