sIFR verdeckt Navigation

[webdesign86]

Hallo liebe TPler,

ich habe per sIFR eine externe Schriftart eingebettet. Darüber befindet sich ein DropDown-Navigationsmenü. Leider werden die Ausklappmenüs von der sIFR Schriftart verdeckt. Das Navigationsmenü ist ein CSS Menü von CSSplay.

Dort wird unter folgender Seite auch genau dieser Fehler beschrieben. Allerdings wird die swf Datei bei sIFR auf so komplizierte Art und Weise eingebettet, dass ich den Fehler nicht beheben kann.

Die Beispielseite auf welcher der Fehler zu sehen ist, könnt ihr hier erreichen.

Kennt sich jemand mit sIFR aus und kann mir weiterhelfen?

[Boris]

Leider werden die Ausklappmenüs von der sIFR Schriftart verdeckt

Bei mir im Feuerfuchs 3.5 siehts top aus ... von welchem Browser sprichst du denn?

[max.m]

Firefox 3.5.1 auf Win XP SP 3 siehts so wie im Anhang aus, also falsch.

Du nutzt einen Mac, oder Boris?

[Boris]

Jo, ich bin auf einem Mac unterwegs.

Allerdings sollte man halt generell beachten, dass sIRF Flash benutzt - welches teilweise schwer bis überhaupt nicht überdeckt werden kann von "normalen" Elementen.

[Corsachriz]

Ich weiss nicht wie genau das bei sIFR läuft, aber damit Flash und Css sich nicht beißen habe ich immer Flash mit

<param name="wmode" value="transparent" />

eingebunden.

Dadurch wird das Flash von CSS überdeckt. Da das Flash bei sIFR über JS eingebunden wird ist das dann warscheinlich etwas komplizierter.

Nur so ein Denkansatz...

[Stefan_G]

Hallo,

schau mal hier - weiter unten. Vielleicht hilft dir das weiter:

(...)

sWmode: Set this argument to transparent if you want to use a transparent background. If you want to stack elements above the Flash movies, you need to set it to opaque. Mozilla browsers can have some difficulty rendering Flash movies with the sWmode set. Therefore setting this is not recommended.

Transparency is not supported in Opera 7.x, Safari < 1.2 & Flash 6, in Linux, and in very old (pre 1.0) Mozilla versions. In these browsers sIFR will fall back to the background color instead of using transparency.
(...)

-> http://novemberborn.net/sifr/where-to-replace

//Stefan

[webdesign86]

Ich weiss nicht wie genau das bei sIFR läuft, aber damit Flash und Css sich nicht beißen habe ich immer Flash mit

<param name="wmode" value="transparent" />

eingebunden.

Dadurch wird das Flash von CSS überdeckt. Da das Flash bei sIFR über JS eingebunden wird ist das dann warscheinlich etwas komplizierter.

Nur so ein Denkansatz...

Genau dieser Lösungsansatz, wird auch in dem Link beschrieben den ich oben erwähnt habe. Aber leider lässt sich das nicht auf sIFR übertragen.

Jedenfalls vielen Dank für eure Antworten!

@Stefan_G: Ich glaube das war der entscheidende Tipp! Ich werde mir das bei Gelegenheit mal genauer durchlesen. Sobald ich mehr weiß, melde ich mich wieder

[webdesign86]

Hallo,

schau mal hier - weiter unten. Vielleicht hilft dir das weiter:
-> http://novemberborn.net/sifr/where-to-replace

//Stefan

So, ich bin jetzt endlich dazu gekommen, mir deinen Tipp mit den Replace Statements näher anzuschauen. Die Replace Statements sind dafür verantwortlich auf welche Art und Weise die Überschriften durch die eigene Schriftart ersetzt werden.

Folgendes Replace Statement muss in meinem Fall in der Datei sifr.js untergebracht werden:

if(typeof sIFR == "function"){
    sIFR.replaceElement("h1", named({sWmode: "opaque"}));
}; 

sWmode: Set this argument to transparent if you want to use a transparent background. If you want to stack elements above the Flash movies, you need to set it to opaque.

Im Body der Datei, in der die betreffende Überschrift vorhanden ist, muss ganz unten dieser Code stehen:

<script type="text/javascript">
if(typeof sIFR == "function"){
    sIFR();
};
</script> 

Dann funktioniert es einwandfrei!!!!
Hier ist das Ergebnis zu sehen: http://www.memmingen-indians.de/sifr_test/


Außerdem habe ich noch eine Alternative zu SIFR gefunden, die etwas einfacher zu handhaben ist: FLIR.
Einfach das Script runterladen, auf den Webspace hochladen und folgende Änderungen durchführen:
- In den Head kommt folgendes:

<script language="javascript" src="flir_test/flir.js"></script> 

- In den Body ganz unten:

<script type="text/javascript">
FLIR.init( { path: 'generate.php/' } );
FLIR.replace('h1'); //eingeben auf welche Überschrift sich FLIR beziehen soll!
</script> 

- In der config-flir.php muss dann die eigene Schriftart eingesetzt werden:

$fonts['illuminating']     = 'MyriadPro-It.otf'; 

Jedenfalls vielen, vielen Dank für eure Hilfe!!! Bin sehr froh, dass es jetzt funktioniert!!!

[Stefan_G]

Moin,

na, das ist doch mal effektives Feedback! Klasse!

//Stefan