2 Bilde mit Verweisen nebeneinander
0 0 0 0 0 0 0 0 0 
Beat
0 0 0 Doppelposting
Gunnar Bittersmann
2 Bilde mit Verweisen nebeneinander
Hallo...
habe immernoch das Problem das ich 2 Bilder nebeneiander darstellen will und sie auf 2 verschiedene Seiten verweisen sollen.
Habe hierzu mal eine kleine Skizze gemacht:
http://img6.imageshack.us/i/menuskizze.jpg/
Also es ist ein DropUp-Menü wenn man auf den unteren Button klickt öffnet sich das schwarze Menü soweit klappt alles.
der Quelltext der 4 schwarzen Links sieht dann wie folgt aus:
<li><a href="http://www.bild1.de"><img src="1.png"></a></li>
<li><a href="http://www.bild2.de"><img src="2.1png"></a>
<a href="http://www.bild3.de"><img src="2.2png"></a></li>
<li><a href="http://www.bild4.de"><img src="3.png"></a></li>
----------------------------------------------------------
Das Problem ist nun das die Bilder 2.1 und 2.2 untereinander stehen habe schon gegoogelt und es soll wohl irgendwie möglich sein die beiden bilder mit komma zu trennen und so in ein <a> zu bekommen das ging sogar aber die Links bekam ich nicht so hin das beide Bilder auf verschiedenen Seiten verweisen.
Wäre toll wenn jemand mir den Codeschnippsel etwas umschreiben kann.
MfG
Aski
-
Grüße,
Bilder (<img>) sind IM <a> - und wohin der link führt entscheidet (ohne Einschränkung der Allgemeinheit) der href von a, also ist es völliges Blödsinn.um genaueres zur Bilddarstellung sagen zu könne, müsste man schon das ganze sehen - irgendwas sagt mir, dass du nicht nur Konstrukte verwendet hast die du verstehst.
MFG
bleicher-
naja will einfach nur 2 bilder nebeneinander bekommen
bild 1 geht auf seite1.html
bild 2 geht auf seite2.htmlEs würde mir schon reichen wenn ich es in einer leeren Seite so darstellen kann aber es geht einfach nicht und die bisherigen Tipps helfen mir irgendwie leider gar nicht hab grad vor 3 wochen angefangen mit html und css also viele begriffe sind für mich noch total fremd.
Aber es ist für mich eigentlich ziemlich offensichtlich das es nur ein kleiner Fehler sein muss.
-
Hi!
Es würde mir schon reichen wenn ich es in einer leeren Seite so darstellen kann aber es geht einfach nicht und die bisherigen Tipps helfen mir irgendwie leider gar nicht hab grad vor 3 wochen angefangen mit html und css also viele begriffe sind für mich noch total fremd.
Ja, verständlich. Aber was können oder sollen wir da tun, außer dir die passenden Stichworte zu liefern?
Lernen und dich mit der (sehr umfangreichen) Materie beschäftigen musst du schon selber.Aber es ist für mich eigentlich ziemlich offensichtlich das es nur ein kleiner Fehler sein muss.
Der dir hier bereits durch verschiedenste Antworten aufgezeigt wurde.
Gruß Gunther
-
Leider wurde der mir aufgezeigte Fehler von mir selber nicht erkannt finde die Antworten leider nicht sehr hilfreich zumindest kann ich leider nichts damit anfangen.
Hab es sogar mit einer Tabelle versucht und nicht mal so griegs ichs zum laufen das ist grad ziemlich Zeitintensiv da alles weitere darauf aubaut :(-
Welche(n) Browser verwendest du zum Betrachten?
Gibt es irgendwelche CSS Eigenschaften, die auf die Liste Einfluss haben?
Wie groß sind die jeweiligen Bilder?Nach deinem obigen Code-Schnippsel nach müssten die beiden Bilder nämlich schon nebeneinander angezeigt werden.
Gruß Gunther
-
Welche(n) Browser verwendest du zum Betrachten?
- Safari (aber im IE und Firefox gleiche Anzeige)
Gibt es irgendwelche CSS Eigenschaften, die auf die Liste Einfluss haben?
Ja aber nichts was etwas mit dem Problem zu tun hat denn ich kann ja nichtmal in ner komplett leeren html datei 2 Bilder nebeneinader bekommen mit 2 links.
Wäre toll wenn jemand nen kleinen Code für mich hätte.Wie groß sind die jeweiligen Bilder?
nicht so groß das ein Zeilenumbruch notwenidg wäre:
160 x 21
87 x 21Nach deinem obigen Code-Schnippsel nach müssten die beiden Bilder nämlich schon nebeneinander angezeigt werden.
- falls du diesen Code meinst:
<a href="http://www.google.de"><img src="1.png"><img src="2.png"></a>
Hier werden die Bilder genau so angezeigt wie ich es will ja aber auf dem 2. bild soll man nicht auf google.de kommen sonder auf eine andere Seite und das weiss ich eben nicht wie ich es hinbekomme.
Habe gerade mal mit imagemap rumexperimentiert aber das is eigentlich nicht so wirklich was ich will.
Gruß Gunther
-
- falls du diesen Code meinst:
<a href="http://www.google.de"><img src="1.png"><img src="2.png"></a>
Es ist doch schon mehrfach darauf hingewiesen worden, dass pro Linkziel auch jeweils ein A Tag/ Element erforderlich ist.
Und ich meinte eher diesen Schnippsel:
<li><a href="http://www.bild1.de"><img src="1.png"></a></li> <li><a href="http://www.bild2.de"><img src="2.1png"></a> <a href="http://www.bild3.de"><img src="2.2png"></a></li> <li><a href="http://www.bild4.de"><img src="3.png"></a></li>oder besser noch so geschrieben:
<ul> <li><a href="http://www.bild1.de"><img src="1.png"></a></li> <li><a href="http://www.bild2.de"><img src="2.1png"></a><a href="http://www.bild3.de"><img src="2.2png"></a></li> <li><a href="http://www.bild4.de"><img src="3.png"></a></li> </ul>Und damit du es dir von Anfang an richtig angewöhnst, solltest du auch gleich noch die erforderlichen Alt-Attribute für die IMG-Tags ergänzen. ;-)
Bei mir werden damit die Images 2.1 und 2.2 nebeneinander angezeigt und verweisen auf unterschiedliche Linkziele.
Gruß Gunther
-
ok schon mal was gelernt jeder link braucht ein a :)
und alt Atribute setze ich immer hab es hier nur weggelassen damit man nur das wesentliche hat.oder besser noch so geschrieben:
<ul>
<li><a href="http://www.bild1.de"><img src="1.png"></a></li>
<li><a href="http://www.bild2.de"><img src="2.1png"></a><a href="http://www.bild3.de"><img src="2.2png"></a></li>
<li><a href="http://www.bild4.de"><img src="3.png"></a></li>
</ul>Bei mir werden sie in keinem Browser nebeneinander angezeigt hab den code teil mal in eine leere Seite geschrieben dort geht es also liegt das Problem doch in meiner css datei . Danke schonmal für die Hilfe :)-
Bei mir werden sie in keinem Browser nebeneinander angezeigt hab den code teil mal in eine leere Seite geschrieben dort geht es also liegt das Problem doch in meiner css datei .
Nein. Es liegt an deiner leeren Datei.
http://de.selfhtml.org/html/allgemein/grundgeruest.htmmfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische-
Bei mir werden sie in keinem Browser nebeneinander angezeigt hab den code teil mal in eine leere Seite geschrieben dort geht es also liegt das Problem doch in meiner css datei .
Nein. Es liegt an deiner leeren Datei.
http://de.selfhtml.org/html/allgemein/grundgeruest.htmMein Grundgerüst ist ok daran liegt es nicht !
Da ich wieder nicht weiter komm versuch ichs mal mit dem kompletten Code das Menü übersteigt eigentlich schon mein Wissen fast kann für nen Profi also etwas chaotisch aussehen sitze da schon ne ganze weile dran:Der Code der Seite:
.
..
...
</head><body>
<div id="menu">
<ul>
<li><h2>TESTTEXT</h2>
<ul>
<li><a><img src="1.png"></a></li>
<li><a href="http://www.bild2.de"><img src="safari.png">
</a><ahref="http://www.bild3.de"><img src="bodo.png"></a></li>
<li><a href="#"><img src="3.png"></a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>_________________________________________________________________________
CSS DATEI Code:
/* CSS Document */ #menu /* DIV Container in dem alles passiert*/ { position: absolute; top:500px; left:54px; width:260px; height:120px; float: left; padding-top:0px; border:0px solid; } #menu ul { list-style: none; /* Ohne Punkte vor den Listenpunkten*/ margin: 0; padding: 0; width: 260px; /*Button Länge*/ float: left; } #menu a, #menu h2 { font: bold 11px/16px arial, helvetica, sans-serif; display: block; border-width: 1px; border-style: solid; border-color: #ccc #888 #555 #bbb; margin: 0; padding: 3px 0px; /*2 und 3 Standard*/ } #menu h2 /*Unterster Button*/ { color: #FF8635; background-image:url(StartButtonTransparent.jpg); /*STARTBUTTON*/ background-position: bottom; background-repeat: no-repeat; text-transform: uppercase; } #menu a /*sind die Submenüs*/ { color: #000; background: #efefef; text-decoration: none; padding: 0px 0px; border-width: 0px; } #menu a:hover /*Submenü Mouseover*/ { color: #a00; background: #fff; } #menu li { position: relative; } #menu ul ul { position: absolute; z-index: 500; bottom:21px; } div#menu ul ul, div#menu ul li:hover ul ul, div#menu ul ul li:hover ul ul { display: none; } div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul { display: block; }Meiner Meinung nacht fehlt etwas in #Menu li damit das Bild nicht in die Zeile 2 rutscht aber wie ich das mache ist wiederum die Frage.
-
Grüße,
weisst du überhaupt was du da hast?
display:block;
bei den a und li verursaht dies - ein block elemnt versucht die gnaze breit einzunehmen dementsprechend ordnen sich blockelemente untereinander an (außer float oder etwas anderes wirkt gegen)sorry@all -> winter=>kalt=>bleichers finger werden sehr steif und ungelenkig
hab 14 grad im zimmer
bleicher-
weisst du überhaupt was du da hast?
display:block;
bei den a und li verursaht dies - ein block elemnt versucht die gnaze breit einzunehmen dementsprechend ordnen sich blockelemente untereinander an (außer float oder etwas anderes wirkt gegen)Und was kann ich dagegen jetzt machen ohne großen Aufwand.
-
Grüße,
Und was kann ich dagegen jetzt machen ohne großen Aufwand.
löschen. zumindest die betroffenen Zeilen - für den Anfang.
MFG
bleicher-
Grüße,
Und was kann ich dagegen jetzt machen ohne großen Aufwand.
löschen. zumindest die betroffenen Zeilen - für den Anfang.Ganz so einfach ist es leider nicht da sonst das Menü seine Funktion verliert.
Aber hab jetzt ne andre Idee werde versuchen die bilder als map zu machen momentan ist dabei nur das problem das beim berühren der Bilder das Menü wieder zugeht warum auch immer -.- !
-
Grüße,
hast du leiseste Ahnung was du da tust?
MFG
bleicher
-
-
-
-
-
-
-
- falls du diesen Code meinst:
-
-
-
-
-
-
Hallo...
... nebeneiander darstellen ...
Immer wenn dieser Ausdruck fällt, ist die Wahrscheinlichkeit zumindest groß, dass derjenige nach der CSS Eigenschaft "float" und/ oder nach dem Wert "inline-block" für "display" sucht.
BTW: Jedes Image wird von seinem eigenen A-Element eingeschlossen, wenn du verschiedene Linkziele damit verknüpfen willst. Der Rest ist eine Frage der Darstellung und fällt somit in den Bereich von CSS.
Gruß Gunther
-
Zum Beispiel hier werden die Bidler korrekt nebeneinander angezeigt wie ich es will:
<a href="http://www.google.de"><img src="1.png"><img src="2.png"></a>
aber jetzt müsste es irgendwie möglich sein auf das zweite Bild noch einen anderen Verweis zu bekommen.
-
@@Aski:
nuqneH
habe immernoch das Problem das ich 2 Bilder nebeneiander darstellen will
Immer noch, eben. Und deshalb bleibst du bitteschön auch in deinem alten Thread und machst keinen neuen auf; Doppelpostings sind unerwünscht.
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
