Transparente PNG's

    Hallo!

    Ich habe eine Seite wo im Hintergrund ein div ist, das einen iFrame beinhaltet. Im Vordergrund ist eine Header und eine Footer-Grafik die leicht geschwungen ist und über den IFrame "drüber ragt".

    Das Problem:
    Man kann durch das transparente PNG nicht "durchklicken", auf das, was im Hintergrund liegt! Sehen tut mans ja (z.b. einen link oder so), wegen der transparenten Farbe, aber man kann so lange nicht darauf klicken bis der link nicht mehr von einem transparenten Teil der PNG überlagert wird.

    Meine Frage:
    Gibts da irgend nen Work-Around oder ne Lösung oder keine Ahnung? :)

    mfg
    infernalshade

    infernalshade,

    Nein. PNG durchsichtig oder nicht stellt Bild und als solches eine Ebene dar. Du kannst nur die obere Ebene "bedienen" also den Button anklicken.
    Wenn Du das mit dem iFrame lassen würdest kann man es auf einer Ebene (einer Seite) mit einer Scheintranzparenz lösen.

    Hier ein Beispiel: http://www.csszengarden.com/?cssfile=096/096.css

    die Spalten sind in der Farbintensivität heruntergesetzte Bilder, sieht aber aus wie durchsichtig. Einfach mal die einzelnen Hintergründe anzeigen lassen (re. Click -> Hintergrundgrafik anzeigen)

    Nene du verstehst mich falsch :)

    Es ist so:

    ich hab 3 div's die mit position:absolute; positioniert sind.

    ein div ganz oben, da ist ein png-bild drin das die headergrafik darstellt.
    ein div hält den iframe und ist in der mitte
    und der letzte div ist unten und hält eine png-grafik die die footergrafik darstellt.

    die header-png und die footer-png haben jetzt aber eine leichte schwingung drin, das heißt es ist die footer-png auf der rechten seite niedriger als auf der linken seite. nur da wo die "schwingung" verläuft ist die grafik eben transparent, damit man den iframe im hintergrund sieht.

    und das problem ist nun das man durch die "transparente schwingung" nicht auf das iframe durchklicken kann, weil die png ja eigentlich 4-eckig ist!

    mfg
    infernalshade

    EDIT:
    Hab mal ein Bild angefügt mit dem Problem. Man kann nicht auf das Eingabefeld neben dem Typen klicken, weil ja eigentlich die Grafik (roter kasten) über das feld darüber-ragt und man den hintergrund nur sehen kann weil das png an dieser stelle transparent ist.

    Dass man durch die Grafik klicken kann, geht nicht. Entweder du verzichtest auf den Klick oder du machst die Grafik weg.

    Das geht vielleicht in Flash. Aber so hab ichs noch nie gesehen. Ich musste auch auf meine Grafik verzichten.

    evtl n vorschlag:

    du legst das bild hinter den iframe, machst in den seiten des iframes
    die css eigenschaft "background-color:transparent;" und versuchst
    des ganze dann nochmal.

    aber keine garantie - funkt glaub ich auch nur im ie...


    edit:
    oder du nimmst statt des iframs ein div. machst dieses ebenfalls
    über des png (is ja von haus aus transparent) und bindest die
    seiten dann mittels php-include ein.

    det is vermutlich die einfachste und sauberste lösung. musst halt
    dann die html-files in php umbenennen...

    versuchs doch mal mit css: area

    <map name='test'><area shape=poly coords=13,3,34,3,44,21,34,40,13,40,3,21 href='bla.html'></map>
    »»

    zwar ne gute überlegung aber ich glaub das funzt nicht, weil ja die grafik ja trotzdem 4eckig ist! du legst ja nur eine map auf die grafik auf die man dann z.b. einen link legen kann oder so!

    mfg

    infernalshade,

    ok, dann würde ich den footer neu erstellen:
    1.den auslaufenden Bogen (Spitze) linkst etwas höher als den "man at work" und oberhalb des "man at work" den Footer trennen.
    2. Die linke kleine abgeschnitten Spitze fest links unten im Mittelteil positionieren, so das genug Platz für das iFrame ist.

    Der Mittelteil sollte dann genau auf den footer aufsetzen und der Übergang fließend sein.

    P.S.: evtl. den "man at work" :lol: etwas verkleinern!

    so wie ichs verstanden habe meinst du das ich einfach das ich den iframe verkleinern soll bis er nur mehr von der spitze rechts oben zu der spitze unten links ragt, oder?!

    wenn ja, das will ich ja nicht, ich will ja ne überlagerung :) find ich stylischer ;)

    mfg

    Zitat von infernalshade

    so wie ichs verstanden habe meinst du das ich einfach das ich den iframe verkleinern soll bis er nur mehr von der spitze rechts oben zu der spitze unten links ragt, oder?!

    wenn ja, das will ich ja nicht, ich will ja ne überlagerung :) find ich stylischer ;)

    mfg

    nnein, vielleicht sieht man es an der Grafik besser