Fürst: Ein Textfeld über eine Grafik legen

SELF-Forum

Ein Textfeld über eine Grafik legen

Fürst
– Informationen zu den Bewertungsregeln

hallo
Ich habe per <img> eine Grafik in eine Seite eingebunden und möchte ein Textfeld darin einbinden. Das Textfeld sollte im Prinzip transparent über einen streng definierten Bereich gelegt werden.
Da ich bloss Kentnisse in Html und JavaScript besitze liebsten mit diesen Mitteln... Ich konnte allerdings keinerlei Infos finden.
Kann mir jemand einen Tipp geben?

grüsse fürst

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Ein Textfeld mit Grafik hinterlegen

    Ashura Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Fürst.

    Ich habe per <img> eine Grafik in eine Seite eingebunden und möchte ein Textfeld darin einbinden. Das Textfeld sollte im Prinzip transparent über einen streng definierten Bereich gelegt werden.

    Kann es sein, dass du den selben Effekt erreichen kannst, indem du dem Textfeld ein http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=Hintergrundbild verpasst?

    Einen schönen Samstag noch.

    Gruß, Ashura

    --
    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
    mathbr:del.icio.us/ mathbr:w00t/
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Ein Textfeld mit Grafik hinterlegen

      Gernot Back Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hallo Ashura,

      Kann es sein, dass du den selben Effekt erreichen kannst, indem du dem Textfeld ein http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=Hintergrundbild verpasst?

      Aber mit einem transparenten Hintergrund funktioniert es doch auch:

        
body { background:url(einHintergrundBild.jpg) no-repeat 50% 50%; }  
textarea { background-color:transparent; }

      Gruß Gernot

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Ein Textfeld mit Grafik hinterlegen

        Fürst
        – Informationen zu den Bewertungsregeln

        Ha, da hab ich gestern vor lauter Code grad gar nix mehr gewusst.
        Danke für eure Feedbacks, hat mir weitergeholfen!

        grüsse
        Fürst

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      2. Ein Textfeld mit Grafik hinterlegen

        fürst
        – Informationen zu den Bewertungsregeln

        Aber mit einem transparenten Hintergrund funktioniert es doch auch:

        body { background:url(einHintergrundBild.jpg) no-repeat 50% 50%; }
        textarea { background-color:transparent; }

          
oke, nächste frage: wie krieg ich die map da noch mit rein? das bild sollte links enthalten...  
  
danke & grüsse  
fürst
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Ein Textfeld mit Grafik hinterlegen

          Gernot Back Homepage des Autors
          – Informationen zu den Bewertungsregeln

          Hallo fürst,

          body { background:url(einHintergrundBild.jpg) no-repeat 50% 50%; }
          textarea { background-color:transparent; }

            

> oke, nächste frage: wie krieg ich die map da noch mit rein? das bild sollte links enthalten...  
  
... gar nicht. Maps lassen sich nur Bildern zuordnen, die im Vordergrund stehen; sie müssen ja auch anklickbar sein, d.h. die Textarea dürfte das Bild nicht überlagern.  
  
Du könntest noch ein transparentes Gif über die Textarea legen, diesem die Map zuordnen, mit der Methode focus() bei Klick darauf in die dahinter liegende Textarea springen lassen und dann könnte der Nutzer auch in diese etwas eintippen. Das funktioniert dann aber nur bei aktiviertem Javascript.  
  
Deshalb solltst du, wenn überhaupt, das transparente Bild und das darunter liegende Hintergrundbild erst einmal neben die Textarea legen und beides erst onload als Sandwich darüber bzw. darunter legen. Das kannst du mit absoluter Positionierung und den entpsrechenden Z-Indizes machen. Dann können Nutzer, in deren Browser JS deaktiviert ist, wenigstens auch etwas in die Textarea schreiben und können auch das daneben liegende transparente Fakebild mit der Map und dem zwei Etagen darunter liegenden Hintergrundbild benutzen.  
  
Das muss ja eine sehr interessante Anwendung sein, für die du solch einen Aufwand treibst ...  
  
Gruß Gernot
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. Ein Textfeld mit Grafik hinterlegen

            Fürst
            – Informationen zu den Bewertungsregeln

            Das muss ja eine sehr interessante Anwendung sein, für die du solch einen Aufwand treibst ...

            Gruß Gernot

            Ich bastle am verbesserten Webauftritt unsrer Rockband. Einer von uns ist Grafiker und hat äusserst genaue Vorstellungen, wies aussehen soll... Und ich soll das jetzt umsetzen... ;)

            Danke für deine Inputs! Langsam nimmts Form an...

            Beitrag melden
            –
            Informationen zu den Bewertungsregeln