schweben mit einem nth-child
ich Frage mich, ob es möglich ist, ein schweben mit einem nth-child wie so
#gallery a img:hover {
display: block;
height:300px;
width:450px;
position:absolute;
z-index:99;
margin-left:-112.5px;
margin-top:-75px;
-webkit-box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
}
Von hier oben zu sehen, um einige Sache wie diese hier unten, nur seine nicht funktioniert
#gallery a img:hover:nth-child(1n+4) {
display: block;
height:300px;
width:450px;
position:absolute;
z-index:99;
margin-left:-112.5px;
margin-top:-75px;
-webkit-box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
box-shadow: 0 2px 15px 1px rgba(0, 0, 0, 0.5);
}
- haben Sie es ausprobiert? Sie können jsfiddle.net
- ja, ich habe versucht, in meinem Skript-es will einfach nicht funktionieren
- Zeigen Sie uns, was Sie versucht haben.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Einwandfrei funktionieren wird, aber im Stil des A-tags statt IMG-innen.
Wenn Sie markup wie...
Können Sie nicht wählen Sie die innere IMG und dann versuchen, eine nth-child auf, denn es ist nur 1 IMG-innerhalb des A-Tags.
Siehe JSFIDDLE erstellt habe ich http://jsfiddle.net/fXS93/2/
Jede änderung in der IMG-markup ist gewickelt zurücksetzen, werden die CSS-matching und das N-te KIND Berechnung. Dies gilt auch dann, wenn Sie passend sind für eine KLASSE, die alle IMG-Aktie.
Dies gilt für die aktuellen FF, Chrome und IE9.
in welchem browser haben Sie versucht das?
und auf wie viele Elemente haben Sie laufen die Formel?
es wird von der Dritten Komponente in Ihre übergeordnete element UND
sollten Sie
:hover
nach der N-TEN Kind:
:nth-child(1n+4):hover
obwohl es nicht funktioniert im IE8 oder älter
EDIT:
ich habe versucht, und die Reihenfolge hat keinen Einfluss auf das Ergebnis, das Sie setzen können
:hover
vor der:nthchild()
nth-child
link und ja, die Reihenfolge ist egal, aber der browser und die Elemente der Menge keine Rolle spielt, wenn es weniger als 4 Ziel-Elemente, die Sie nicht sehen können, das Ergebnis, wenn die Maus hover auf Sie