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

filter:alpha

dkdenz

New member
Ich bin mit meinem Latein am Ende.
Ich will Links einen Alpha-Effekt zuweisen, aber der IE spielt da nicht mit.
Habe alles mögliche schon probiert.
Strict in Transitional gewechselt, XML-Prolog entfernt, display:block, width+height, mit Hintergrundgrafik.
Habe mich an die Vorgaben von M$ gehalten (soweit ich sie verstanden habe):
Alpha Filter
hasLayout Property (A, ABBR, ACRONYM, ...)
Aaaber nix geht...
...vielleicht hat ja jemand von euch eine zündende Idee.
HTML:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>Dokumenttitel</title>
<style type="text/css">
/*<![CDATA[*/
a.menu_links:link, a.menu_links:visited, a.menu_links:hover, a.menu_links:active {
  font-size:0.9em;
  font-weight:bold;
  border:1px solid #7d4e3a;
  padding:2px 4px 2px 4px;
  color:#000;
  text-decoration:none;
  background:#efdaa2;
  opacity:0.4;
  -moz-opacity:0.4;
  -khtml-opacity:0.4;
  filter:alpha(opacity=40);
  }
a.menu_links:hover {
  opacity:1.0;
  -moz-opacity:1.0;
  -khtml-opacity:1.0;
  filter:alpha(opacity=100);
  }  
/*]]>*/
</style>
</head>
<body>
<a href="" class="menu_links">Link</a>
</body>
</html>
 
ich hatte mal probleme bei einem browser, weiss aber nicht mehr obs der ie oder gecko war, jedenfalls war die lösung des problems, dass man den alpha-wert nicht auf 1 bzw 100 stellte, sondern nur auf 0.99 bzw. 99.
 
Ich hab das ganze auch für ein INPUT - Feld definiert. Mit dem hat es funktioniert. Sieht so aus als würde die Transparenz entgegen der Aussage auf der M$ homepage mit Links nicht funktionieren.
http://msdn.microsoft.com/workshop/author/filter/reference/filters/alpha.asp schrieb:
Applies To

A, ABBR, [...]
Ich hab auch versucht das Problem mit einem display:block zu lösen. Hat nicht geklappt.
 
Zuletzt bearbeitet von einem Moderator:
Nimm display:inline-block...
Leider ohne Erfolg...
23_3.gif
 
Hat bei mir gestern problemlos gefunzt. Hab es gerade mal mit kompletter XHTML-Variante (mit Prolog) gecheckt - auch kein Problem...
 
Gehste mal bitte mit Deinem IE drüber?
Meiner zeigt das nicht an.
Wäre toll...
(Link schon wieder gekillt)

Zwischen Menu in der CSS ist das Problemkind...
 
Zuletzt bearbeitet:
Danke!!! :) :) :)
Mein Kotzding hat anscheinend keinen Bock drauf...

Dann kann ich ja beruhigt weiter machen...
 
Ich denk' schon!?
Irgendwie zickt der im Offline-Betrieb rum.
Werd' ihn wohl morgen mal kurz in's Netz lassen... ;)
 
Hallo,

möchte das Thema

"Layer bzw. hier Link von teilweise transparent (untere Ebene) auf nicht transparent (oberste Ebene)"

nochmals aufgreifen, habe das gleiche Prob und bin bei der Suche nach Lösungen hier im Forum gelandet.

im IE passiert gar nix, im Firefox wird zumindest der nicht überlappende Teil richtig angezeigt.

Werte auf 99 bzw. 0.99 zu setzen und auch display: block-inline;
bringt leider gar nichts.

Was mir aber aufgefallen ist:

meine Schreibweise der CSS-Styles ist anders, bei mir würde der Code so aussehen:

Code:
a.menu_links:link, a.menu_links:visited, a.menu_links:hover, a.menu_links:active {
  font-size:0.9em;
  font-weight:bold;
  border:1px solid #7d4e3a;
  padding:2px 4px 2px 4px;
  color:#000;
  text-decoration:none;
  background:#efdaa2;
  [B]filter:alpha(opacity=40);-moz-opacity:0.4; opacity:0.4;[/B]
  }

a.menu_links:hover {
  [B]filter:alpha(opacity=100);-moz-opacity:0.99; opacity:0.99;[/B]

Frage: macht die Schreibweise ggf. den Unterschied und welche ist richtig?

Frage 2 (wenn ich schon dabei bin): wofür steht -khtm?

Weiß jemand Rat?

Lieber Gruß!
Maya
 
Zuletzt bearbeitet von einem Moderator:
Moin!

Für IE reicht ein zusätzliches display:inline-block (nicht umgekehrt).

khtml-opacity ist für Konqueror und ältere Safaris.

Ahoi - Pit
 
Huhu, zuerst mal Danke für die schnelle Reaktion!

Habe mich mit block-inline bzw. andersrum nur in dem Posting vertan, im Stylesheet ist es richtig, allerdings ohne Auswirkung:

Unterer Layer - transparent:

div.bodyM {
filter: alpha(opacity=90); -moz-opacity:0.90; opacity:0.90;
position: absolute;
top: 140px;
left: 190px;
width: 620px;
z-index: 1;
background-color: transparent;
}

Mittlerer Layer - halbtransparent und farbig:

div.bodyLayer {
z-index: 2;
background-color: #41C9E1;
min-height: 1000px; (min-height wird übrigens auch ignoriert)
}

Oberster Layer, der nicht mehr transparent sein soll:

div.productListing {
filter: alpha(opacity=99); -moz-opacity:0.99; opacity:0.99;
display: inline-block;
background-color: #FFFFFF;
z-index: 3;
margin-left: 20px;
width: 580px;
}

Habe auch irgendwo gelesen, dass man den Filter mit filter: none; ausschalten könne.
Hat zumindest bei mir keine Auswirkung, bzw. Dreamweaver meckert an, dass es diesen Code gar nicht gäbe.

Habe eben noch Folgendes gefunden:

Coding-Schatzkästlein

Inhalt:

Zusammenfassung
Name: Transparency

Aufgabe: Sorgt (z.Zt.) auf IE (ab Version 5), Mozilla, KHTML-Browsern (Konqueror, Safari) und generell auf CSS-3-Browsern für die transparente Darstellung von HTML-Elementen. Die Auswahl kann direkt über ein Objekt, über das ID-Attribut, das NAME-Attribut oder ein HTML-Tag erfolgen.

Benötigt: JavaScript 1.5 (gesichert, nicht gesichert für JavaScript 1.0)

Beispiel: transparency("img",40)
transparency("Bild1",60)
transparency(images[1])

Download: transobj.js


Lieber Gruß!
Maya
 
Zuletzt bearbeitet:
Zurück
Oben