Mam ul z kilkoma elementami li, jeden z nich zawsze będzie miał klasę „aktywną”. Jak mogę sprawić, by element li.active zawsze pojawiał się na górze listy?
Nie mogę kontrolować produkcji HTMLtę listę, więc musiałbym to zrobić za pomocą css (najlepiej) lub javascript / jquery. Myślę, że nie ma sposobu, aby to zrobić za pomocą css, ale byłoby wspaniale mieć jakąś właściwość position-in-list.
Wielkie dzięki!
Odpowiedzi:
2 dla odpowiedzi № 1Jeśli (i myślę, że tak) musisz manipulowaćRzeczywiste zamówienie elementu listy, jak zgadujesz, sam CSS go nie tnie. Tagujesz ten post słowem „jquery”, więc myślę, że wiesz o selektorach tej biblioteki i tak dalej. Na pewno potrzebujesz aby (a) wybrać element li z klasą „active”, a następnie (b) wstawić wspomniany element na górze nieuporządkowanej listy? Jest to całkowicie możliwe w jQuery. Tutaj (BARDZO) prosty sposób to zrobić :
$("ul").prepend($(".active"));
Wszystko, co robi, to złapanie pierwszego elementu nastrona z klasą „active” i dołącza ją do pierwszej nieuporządkowanej listy. Jest to prawdopodobnie zbyt uproszczone dla twoich potrzeb, ale mam nadzieję, że pomoże ci znaleźć bardziej niezawodne rozwiązanie.
4 dla odpowiedzi nr 2
Jeśli założymy, że wysokość elementów listy będzie stała (i to dość duże założenie):
ul {
position: relative;
padding-top: 2em;
}
li {
height: 2em;
}
li.active {
position: absolute;
top: 0;
left: 0;
}