mikrocontroller.net

Forum: Mikrocontroller und Digitale Elektronik Wie kann ich ein Bild in ein Bild einbauen? HTML


Autor: Tubie (Gast)
Datum:
Angehängte Dateien:

Bewertung
0 lesenswert
nicht lesenswert
Hallo,

der kleine Siteplayer ist schon ziemlich der Hammer! Jetzt habe ich dazu 
mal eine kleine Frage:

Ich habe ein Bild (.PNG)  581 * 481 Pixel

<P ALIGN=LEFT STYLE="margin-bottom: 0cm; background: transparent"><FONT 
COLOR="#000000"><IMG SRC="graph/Hydraulik.png" NAME="Grafik6" ALIGN=LEFT 
WIDTH=581 HEIGHT=481 BORDER=1></FONT>
</P>

so jetzt möchte ich in diesem Bild Ventile schalten bzw. Signalisieren, 
das eine pumpe läuft.

Habe mir dazu gedacht, einfach genau auf die Grafik Position, des 
Ventiles oder der Pumpe eine neue .gif / .png Datei einer bestimmten 
Größe (x*y Pixel) draufzuladen.

Also erst das Grundbild aufbauen und dann je nach gewünschtem Status ein 
kleines animatet GIF wechses die Pumpe drehen lässt. Geht sowas in HTML 
code? Und wenn Ja, wie?

Wäre echt cool, wenn ihr mir helfen könntet.

Gruß,
Tubie

Autor: Sven P. (haku) Benutzerseite
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Ich weiß zwar nicht, was Siteplayer ist, aber naja.


> <P ALIGN=LEFT STYLE="margin-bottom: 0cm; background: transparent"><FONT
> COLOR="#000000"><IMG SRC="graph/Hydraulik.png" NAME="Grafik6" ALIGN=LEFT
> WIDTH=581 HEIGHT=481 BORDER=1></FONT>
> </P>
Wer hat denn den Schwachsinn produziert?!

Mach mal lieber
<img src="graph/Hydraulik.png" id="Grafik6" width="581" height="481" />
Und den Rest inklusive Positionierung mit CSS.
Der Internet Explorer war bis vor Kurzem übrigens noch zu dämlich, um 
transparente PNG darzustellen, also wunder dich nicht.

Autor: Tubie (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
> Ich weiß zwar nicht, was Siteplayer ist, aber naja.

Ist ein mini Webserver auf µC basis


> Wer hat denn den Schwachsinn produziert?!

Open Office 3, meine HTML kenntnisse sind momentan noch = 0,1. ;) Habe 
das ganze in Office generiert, als .html gespeichert und dann die Code 
segmente rausgeschmissen, die mir überflüssig erschinen.


> Und den Rest inklusive Positionierung mit CSS.

Habe soeben Google befragt


Danke erstmal!

Gruß,
Tubie

Autor: Gast (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
>Open Office 3, meine HTML kenntnisse sind momentan noch = 0,1. ;) Habe
>das ganze in Office generiert, als .html gespeichert und dann die Code
>segmente rausgeschmissen, die mir überflüssig erschinen.

Sehr sinnvoll. Zwar keine Ahnung von HTML, aber einfach alles löschen, 
was deiner Meinung nach falsch ist. Und ein Officeprogramm ist nicht 
gerade DAS Programm für eine Webseite. Benutz lieber ein richtiges 
Programm dafür, Composer im Seamonkey Paket, oder sowas. Aber bloß nicht 
Frontpage!

Versuch es am Besten erst nochmal mit einem anderen Programm, und mach 
das ganze lieber gleich als ein einzige .gif, statt so komisch ein Bild 
zusammen basteln.

Autor: Tubie (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
> ... und mach das ganze lieber gleich als ein einzige .gif, statt so
> komisch ein Bild zusammen basteln.

Das Bild soll sich doch während des betriebes verändern, Pumpen 
laufen/stehen und Ventile werden umgeschaltet. Dieses möchte ich mit 
kleinen Bildern, welche nur die Pumpe/Ventile enthalten "oben drauf" 
setzen.

Ich habe natürlich nur die Sachen weggenommen, die wirklich überflüssig 
waren...

Gruß,
Tubie

Autor: Johann L. (gjlayde) Benutzerseite
Datum:

Bewertung
0 lesenswert
nicht lesenswert
das zweite Bild in einen div-Layer mit anderem z-Index?

Aber darauf achten, daß es brauerüebrgreifend ist ;-)

Autor: Andreas Schwarz (andreas) (Admin) Benutzerseite Flattr this
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Stichworte: CSS-Positionierung, JavaScript, AJAX. Mit generiertem HTML 
ohne Handarbeit geht das allerdings nicht.

Autor: Tubie (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Ok, das ist erstmal genug Lesestoff. Werde mal sehen, was ich machen 
kann.

Vielen Danke für die Wertvollen Infos!

Gruß,
Tubie

Antwort schreiben

Die Angabe einer E-Mail-Adresse ist freiwillig. Wenn Sie automatisch per E-Mail über Antworten auf Ihren Beitrag informiert werden möchten, melden Sie sich bitte an.

Wichtige Regeln - erst lesen, dann posten!

  • Groß- und Kleinschreibung verwenden
  • Längeren Sourcecode nicht im Text einfügen, sondern als Dateianhang

Formatierung (mehr Informationen...)

  • [c]C-Code[/c]
  • [avrasm]AVR-Assembler-Code[/avrasm]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] - Link zu Artikel
  • Verweis auf anderen Beitrag einfügen: Rechtsklick auf Beitragstitel,
    "Adresse kopieren", und in den Text einfügen




Bild automatisch verkleinern, falls nötig
Bitte das JPG-Format nur für Fotos und Scans verwenden!
Zeichnungen und Screenshots im PNG- oder
GIF-Format hochladen. Siehe Bildformate.
Hinweis: der ursprüngliche Beitrag ist mehr als 6 Monate alt.
Bitte hier nur auf die ursprüngliche Frage antworten,
für neue Fragen einen neuen Beitrag erstellen.

Mit dem Abschicken bestätigst du, die Nutzungsbedingungen anzuerkennen.