nicht angemeldet
Der Martin
Matthias Apsel
Der Martin
Matthias Apsel
Gunnar Bittersmann
Gunnar Bittersmann
Ich habe zwei Probleme. Ich möchte über eine ul/li mehrere Boxen auf einer Seite darstellen.
Jede Box soll 300 breit 200 hoch sein. Wenn man über die Box mit der Maus fährt soll sie sich ändern und einen anderen Text anzeigen. Jetzt zu meinen Problemen:
1. Der Link bei NEIN ist nur in der Breite des Textes aktiv, nicht aber überall in der Box.
2. Nach dem Wechseln der Box sollte ein Link sein, doch dieser macht denn Hovereffekt NICHTIG.
Um es besser darzustellen habe ich es unter http://jsfiddle.net/D2vrV/2/ gepostet.
Es wäre toll wenn der ein oder andere sich mein Problem mal ansehen könnte!
Bernd
Hallo,
Um es besser darzustellen habe ich es unter http://jsfiddle.net/D2vrV/2/ gepostet.
Es wäre toll wenn der ein oder andere sich mein Problem mal ansehen könnte!
ich sehe mehrere Probleme.
1. div als Nachfahre eines a-Elements ist nur in HTML 5 erlaubt, wird aber AFAIK von allen heutigen Browsern auch ohne HTML5-DOCTYPE korrekt interpretiert. Formal korrekt ist es aber erst *mit* einem HTML5-DOCTYPE.
2. Keinesfalls erlaubt ist ein a-Element als Nachfahre eines anderen a-Elements, so wie bei der zweiten Box. Das ist nicht nur eine Formalität, es bringt auch die Browser ins Straucheln, weil bei verschachtelten Links nicht mehr klar ist, wem ein Klick oder :hover zugeordnet werden soll.
3. Dein CSS hat für li eine ungültige Angabe zu 'background'.
4. Ich rätsle, was position:relative und der Versatz um -2/-21 Pixel für .box a:hover .gross für einen Sinn haben soll.
So long,
Martin
- Keinesfalls erlaubt ist ein a-Element als Nachfahre eines anderen a-Elements, so wie bei der zweiten Box. Das ist nicht nur eine Formalität, es bringt auch die Browser ins Straucheln, weil bei verschachtelten Links nicht mehr klar ist, wem ein Klick oder :hover zugeordnet werden soll.
Das heisst dann, das ein Link inerhalb meines Lins nicht geht... :-(
Om nah hoo pez nyeetz, Bernd!
Das heisst dann, das ein Link inerhalb meines Lins nicht geht... :-(
genau, denn welchem Link soll der Browser denn jetzt folgen? Bei der Konstruktion <a href="a.html"><a href="b.html">Linktext</a>anderer Linktext</a> wird das schwierig.
Matthias
Om nah hoo pez nyeetz, Bernd!
Das heisst dann, das ein Link inerhalb meines Lins nicht geht... :-(
genau, denn welchem Link soll der Browser denn jetzt folgen? Bei der Konstruktion <a href="a.html"><a href="b.html">Linktext</a>anderer Linktext</a> wird das schwierig.
Matthias
Habe ich irgendwie die Möglichkeit, dort einen Link hinzubekommen
Hallo,
Das heisst dann, das ein Link inerhalb meines Lins nicht geht... :-(
Habe ich irgendwie die Möglichkeit, dort einen Link hinzubekommen
ja klar, indem du auf den "äußeren" Link verzichtest. Hat der überhaupt eine Funktion? Ich denke, eher nicht.
Oder hängst du noch an der Beschränkung von IE bis Version 6, :hover sei nur auf Links anwendbar?
So long,
Martin
Nein, und du hast Recht.
Jetzt funktioniert es wie es soll.
Danke an alle
Bernd
Mahlzeit,
und wofür sind die beiden divs? Du könntest alternativ die p-Elemente direkt stylen.
@@Bernd:
nuqneH
Jetzt funktioniert es wie es soll.
Dieser Thread ist ein trauriges Beispiel für Antworten, die sich auf die technische Umsetzung von völligem Unfug stürzen.
Wo ist der Nicht-hilfreich-Button?
Danke an alle
Nicht dafür.
Qapla'
Om nah hoo pez nyeetz, Bernd!
Habe ich irgendwie die Möglichkeit, dort einen Link hinzubekommen
Ich verstehe nicht so ganz, was du vorhast? Du möchtest Leuten bei hover einen anderen Link unterjubeln? Oder soll sich nur der Linktext ändern?
Warum dies?
a)
<li>
<a href="a.html">Linktext A</a>
<a href="b.html">Linktext B</a>
</li>
li > a + a {
display: none;
}
li:hover > a {
display: none;
}
li:hover > a + a {
display: inline;
}
b)
<li>
<a href="a.html"><span>Linktext A</span><span>Linktext B</span></a>
</li>
Das CSS trau ich dir alleine zu.
Matthias
Ich verstehe nicht so ganz, was du vorhast? Du möchtest Leuten bei hover einen anderen Link unterjubeln? Oder soll sich nur der Linktext ändern?
Ich möchte keinen einen Link unterjubeln. Ich habs jetzt so umgeschrieben, jetzt geht alles bis auf den Link:
Om nah hoo pez nyeetz, Bernd!
Dein HTML:
<div class="hover-container">
<p>text</p>
<a class="hover-content" href="#">
<p>
hier soll der link hin
</p>
</a>
</div>
Ich verstehe dich nicht: Der Link ist doch schon da. Das ganze a-Element ist der Link.
Matthias
Mahlzeit,
<div class="hover-container">
<p>text</p>
<p class="hover-content">
<a href="#">Link</a>
</p>
</div>
Und wo ist nun genau dein Problem?
Wobei der Container völlig unnötig ist in dem Fall.
@@Bernd:
nuqneH
Ich möchte keinen einen Link unterjubeln. Ich habs jetzt so umgeschrieben, jetzt geht alles bis auf den Link:
Nichts geht. Mein Gerät hat keinen Hover-Effekt. Es hat gar keine Maus.
Und das ist nicht nur bei mir so, sondern bei einer ständig wachsenden Mehrheit der Nutzer. In sehr naher Zukunft wird das die Mehrheit sein.
Warum soll die Mehrheit der Besucher deiner Seite diese nicht bedienen können?
Qapla'
@@Matthias Apsel:
nuqneH
genau, denn welchem Link soll der Browser denn jetzt folgen? Bei der Konstruktion <a href="a.html"><a href="b.html">Linktext</a>anderer Linktext</a> wird das schwierig.
Dem inneren. Hätte man so festlegen können. Hat man aber nicht. Auch dafür wird’s gute Gründe geben.
Qapla'
@@Der Martin:
nuqneH
- div als Nachfahre eines a-Elements ist nur in HTML 5 erlaubt, wird aber AFAIK von allen heutigen Browsern auch ohne HTML5-DOCTYPE korrekt interpretiert.
Zweiteres (und zwar auch schon von gestrigen Browsern) war Voraussetzung für ersteres.