Browserproblem CSS (Web Tel.Nr. Vergrösserungfunktion ä la Adressbuch)

[Oliver23]

Hallo Zusammen

Ich habe mit CSS eine Funktion gebastelt, welche die Telefonnummer vergrössert, so wie im Apple Adressbuch. Leider funktioniert es mit Safari und IE6 nicht

Hier das Beispiel:
http://www.webgarten.ch/preview/phonezoom/

Zudem setze ich das Objekt mit der Telefonnummer 80% transparent. Dumm ist nur dass auch die weisse Telefonnummer transparent wird. Was dann nicht so toll ist wenn sich hinter der Nummer das Layout der Webseite befindet.

Grüsse - Oliver

 

[2nd]

Das funktioniert schon. Du hast nur einen Syntaxfehler im CSS eingebaut:

a.tooltip:active span, a.tooltip:focus span {
display: block;
position: absolute;
top: 200px;
left: 20px;
width: 900px;
height: 123px;
padding-top: 20px;
z-index: 100;
font: 90px Arial, sans-serif;
font-weight: bold;
color:#fff;
text-align: center;
text-decoration: none;
border: 1px solid #224996;
background-color: #224996;
filter:alpha(opacity=80);
-moz-opacity:0.8;
opacity: 0.8;"
}

Nimm mal den Doppelstrich weg, dann geht es im Safari. Zum IE kann ich jetzt nichts sagen.

2nd

 

[Oliver23]

Das funktioniert schon. Du hast nur einen Syntaxfehler im CSS eingebaut:

Nimm mal den Doppelstrich weg, dann geht es im Safari. Zum IE kann ich jetzt nichts sagen.

2nd

Super danke!

In Safari geht es jetzt zwar nicht auf Klick aber wenn man die Maustaste gedrückt hält. Damit kann ich leben.

Im Sch*** IE6 geht es aber immer noch nicht

 

[2nd]

Zum IE:

IE/Win 5.x, IE/Win 6
MS IE/Win bis Version 6 stellt :active nicht immer mit allen deklarierten Eigenschaften dar. Die Pseudoklasse :hover wird nur am Element a erkannt, :focus überhaupt nicht. Auch die Forderung, dass die drei dynamischen Pseudoklassen sich nicht gegenseitig ausschließen sollen, wird nicht uneingeschränkt so interpretiert.

Quelle: http://www.thestyleworks.de/ref/pc_dynamic.shtml

Nachtrag: Bei mir geht es übrigens im IE6/WinXP. Siehe Screenshot.

2nd

 

[Oliver23]

Zum IE:

Quelle: http://www.thestyleworks.de/ref/pc_dynamic.shtml

Nachtrag: Bei mir geht es übrigens im IE6/WinXP. Siehe Screenshot.

2nd

Aha vielleicht liegt es an meinem IE6. Es ist eine spezielle Variante die neben dem IE7 auf dem gleichen PC läuft. Ich werde es demnach noch auf anderen PC's testen müssen.

 

[2nd]

Ist bei mir auch so: IE3 - IE7 unter Parallels mit WinXP auf dem Mini.

2nd

 

[Oliver23]

Ist bei mir auch so: IE3 - IE7 unter Parallels mit WinXP auf dem Mini.

2nd

Du meinst IE6 nicht 3 oder? Meine Version ist nicht wirklich installiert sondern nur ein exe File welches ich starte. Da ist sicher was faul daran. Unter Version wird dann auch die 7ner angezeigt.

 

[2nd]

Doch, ich meine IE v3 bis IE v7, also 3, 4, 5.1 + 5.5, 6 und 7. Bei mir wird ebenfalls unter "Über..." der IE v7 immer angezeigt, in der Titelleiste steht allerdings die Version des Browsers, z. B. Internet Explorer 6.

2nd

 

[Oliver23]

Doch, ich meine IE v3 bis IE v7, also 3, 4, 5.1 + 5.5, 6 und 7. Bei mir wird ebenfalls unter "Über..." der IE v7 immer angezeigt, in der Titelleiste steht allerdings die Version des Browsers, z. B. Internet Explorer 6.

2nd

Aha... weiss nicht warum es bei mir nicht geht. Vielleicht fühlt der IE sich einfach wohler auf nem Mac als auf einem alten PC. Das könnte ich gut verstehen.

Das Problem mit den Transparent kriegt man wohl nicht hin. Habs auch noch in einem anderen Forum gepostet.

Gruss - Oli

 

[freso]

wenn du nichts gegen javascript hast, dann würde ich dir diese lösung vorschlagen: http://www.qxm.de/webdesign/20031201-090246?com=1

damit kannst du ein div ein und ausblenden. mit der richtigen positionieren des divs, kannst du deine fonnummer immer schön mittig im browserfenster anzeigen lassen.

 

[Oliver23]

So ich habe es jetzt mit CSS gleich bei meinem aktuellen Projekt eigebaut. Für die Transparenz habe ich ein PNG verwendet und ein Javascript für den IE.

Wie findet ihr es, funktioniert es beu Euch? Leider spinnt mein IE auf dem PC und mein Mac ist noch kein Intel. Könnte mal jemand ein Blick im Windows IE6 oder 5 darauf werfen?

Klick auf Lupe oben rechts:
http://basel.tophost.ch/~kraemers/index.php

 

[Oliver23]

Habs bereits wieder etwas umgebaut. Es reagiert jetzt auf hover und nicht mehr auf Klick. Dafür funzt es auf allen Browsern.