tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
10
ZUGRIFFE
8220
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    vaporizer vaporizer ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Beiträge
    206
    Hallo zusammen

    ich steh wieder mal vor einem Problem
    also ich hab auf der linken Seite meiner Page ein Bild(jpg) eingefügt ca50*150
    in diesem Bild will ich nun meine Buttons(jpg) haben
    die ich dann anklicken kann um an mein Ziel zu kommen
    wie füge ich meine Buttons(jpg) in dieses Bild ein?
    kann mir da jemand weiterhelfen?
    hab mir auch überlegt das bild mit den Buttons fertig zu gestallten
    und dann die Anklickflächen der Buttons zu koordinieren
    wie lässt sich dies umsetzten?
    was wäre vernünftiger?
    hoffe ihr könnt mir weiter helfen

    Schöne Grüße von vaporizer
     

  2. #2
    Avatar von Markus Kolletzky
    Markus Kolletzky Markus Kolletzky ist offline Come here the voices
    tutorials.de Administrator
    Registriert seit
    May 2003
    Ort
    Berlin
    Beiträge
    4.457
    Blog-Einträge
    17
    Hi,

    Zu 1.) Du kannst Dein "Hintergrundbild" als Tabellenhintergrund machen und dann die Buttons da rauf setzen.

    Code :
    1
    
    <td background="bild.png"><a href="URL.htm"><img src="button.png"></a></td>

    oder
    2.) Dein Bild per Maps gestalten
    Code :
    1
    
    <img src="Dein_hintergrundbild.png" width="xxx" height="xxxx" usemap="#Map"><area shape="rect" coords="xyz,zyx,yxz,zxy" href="URL_deiner_wahl.html">

    Mit den Maps funktioniert das in Dreamweaver recht einfach, zu finden unter den Eigenschaften; siehe Screenshot:
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken Bild in einem Bild einfügen?-tut.gif  
     

  3. #3
    vaporizer vaporizer ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Beiträge
    206
    also ich hab nun mein Bild als Hintergrund für die Zelle gewählt
    nur leider sieht man nur den linken oberen Teil des Bildes
    gibts eine Möglichkeit die Größe des bildes an die Zelle anzupassen?
     

  4. #4
    Avatar von Markus Kolletzky
    Markus Kolletzky Markus Kolletzky ist offline Come here the voices
    tutorials.de Administrator
    Registriert seit
    May 2003
    Ort
    Berlin
    Beiträge
    4.457
    Blog-Einträge
    17
    Ja, gibt es. Indem Du die Größe der Zelle an Dein Bild anpasst:

    Code :
    1
    
    <td height="Größe_der_Zelle, je_nach_Bild" width="das_Gleiche">
    oder gleich mit %-Angaben arbeitest.
     

  5. #5
    vaporizer vaporizer ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Beiträge
    206
    aber es muß doch möglich sein das jpg an die zelle anzupassen
    oder etwa nicht?
     

  6. #6
    Helge Helge ist offline Mitglied Silber
    Registriert seit
    Mar 2004
    Beiträge
    51
    Ja klar in dem du das bild auf die größe bringst:
    - Entweder du machst ein neues Bild mit den richtigen Größen in dem Grafikprogramm deiner Wahl
    - Oder du vergrößerst das bild in dem Grafikprogramm deiner Wahl ( meist geringer Qualitätsverlust, je nach vergrößerung )
    - oder du gibst die neue Größe im HTML Code an: meinetwegen bei einem 25*75px großen bild: " <img src="25x75.gif" style="width: 50px; height: 150px; " alt="" /> " ( größerer Qualitätsverlust )
     

  7. #7
    Avatar von christhebaer
    christhebaer christhebaer ist offline Mitglied Silber
    Registriert seit
    Feb 2004
    Beiträge
    74
    Hallo!

    Ich habe da vielleicht mal einen Tipp.

    Ich benutze für sowas immer eine transparente Grafik (1x1 Pixel groß als GIF).
    Diese lege ich dann in eine td und gebe der dann die gewünschte Höhe,
    da die Höhenangabe bei TDs nicht von jeden Browser umgesetzt werden.

    Gruß
    christhebaer
     
    « Es kommt nicht darauf an wie alt man wird, sondern wie man alt wird. »

  8. #8
    vaporizer vaporizer ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Beiträge
    206
    also meine Zeile sieht so aus
    <td style="background-image:url(links.jpg); width:100px; height:150px;">
    aber egal wieviele px ich angebe
    das hintergrundbild bleibt immer gleich groß
    woran liegt das?
     

  9. #9
    Avatar von SilentWarrior
    SilentWarrior SilentWarrior ist offline Mitglied Diamant
    Registriert seit
    Dec 2001
    Beiträge
    3.078
    vaporizer: Die Grösse des Hintergrundbildes kannst du afaik auch nicht verändern, dazu muss das Bild schon als expliziter Inhalt der Zelle angegeben werden.

    christhebaer: http://selfhtml.teamone.de/grafik/so...m#blinde_pixel
     

  10. #10
    Avatar von Sven Mintel
    Sven Mintel Sven Mintel ist offline Mitglied
    Registriert seit
    Aug 2003
    Beiträge
    18.238
    Blog-Einträge
    6
    Ich würd die Bilder gleich fertig mit Button machen... über ne Imagemap kannst du dann bewirken, dass lediglich der Bereich mit dem Button klickbar ist.
     

  11. #11
    Avatar von steff aka sId
    steff aka sId steff aka sId ist offline Mitglied Brokat
    Registriert seit
    Jan 2004
    Ort
    Mannheim
    Beiträge
    341
    Könnte man nicht hingehen und mit css die Postion des 2. Bildes absolut über das 1. zu legen müsste doch theoretisch auch funktionieren.
    Bild1:
    Code :
    1
    
    <img src=".." style="position:absolute; margin-left:0; margin-top:0;">
    Bild2:
    Code :
    1
    
    <img src=".." style="position:absolute; margin-left:10; margin-top:10;">

    in etwa so. Hab das jetzt nicht probiert aber müsste eigentlich klappen.
    Greetz Steff

    <edit>Jo funktioniert. Habs getested
    Mein Beispiel:
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    
    <html>  
    <head>
    <title>test</title>
    <style type="text/css">  
    <!--  
    .bild1 {position:absolute; margin-left:0px; margin-top:0px;}  
    .bild2 {position:absolute; margin-left:35px; margin-top:2px;}
     //--!> 
    </style>
    </head>
    <body>
    <img src="aktiv.png" class="bild1"></img>  
    <a href="http://sid.distance.de"><img src="bild.png" class="bild2"></img></a>  
    </body>
    </html>
    </edit>
    Geändert von steff aka sId (03.04.04 um 14:40 Uhr)
     

Ähnliche Themen

  1. Antworten: 1
    Letzter Beitrag: 06.07.10, 14:51
  2. Datum und Zeit in einem Bild einfügen
    Von Hadinius im Forum Visual Basic 6.0
    Antworten: 0
    Letzter Beitrag: 09.03.10, 15:14
  3. Antworten: 4
    Letzter Beitrag: 03.08.08, 11:29
  4. Bei einem Graph Diagramm, Bild einfügen
    Von MasterBN im Forum PHP
    Antworten: 4
    Letzter Beitrag: 17.09.07, 14:39
  5. Antworten: 3
    Letzter Beitrag: 14.06.05, 15:42