Hej,
mam na forum opcję zwijania działów, jednak po odświeżeniu strony wszystko wraca do poprzedniego stanu, z wszystkimi działami rozwiniętymi. Co zrobić aby zapamiętywało ustawienie?
Adres forum:
http://alpha-team.eu/
Dziękuję z góry i pozdrawiam
Tak na początek to dołączasz dwa razy jQuery w szablonie headerinclude. Usuń jedno (najlepiej to pierwsze).
(24.03.2018, 19:39)Divir napisał(a): [ -> ]Tak na początek to dołączasz dwa razy jQuery w szablonie headerinclude. Usuń jedno (najlepiej to pierwsze).
Masz na myśli ten który zaznaczyłem?
[
attachment=13506]
Nie, ten wyżej - jquery-latest.
Zrobione, dzięki za wskazówkę.
Jakieś pomysły jak rozwiązać problem braku zapamiętywania zwiniętych działów?
Na samym dole szablonu
footer dodaj:
Kod:
<script>
$(document).ready(function() {
$(".expcolimage .expander").each(function() {
if ($(this).data('src')) {
$(this).addClass($(this).data('src').replace('.png', ''));
}
});
expandables.expandCollapse = function(e, controls) {
element = $(e);
if (!element || controls == false) {
return false;
}
var expandedItem = $("#" + controls + "_e");
var collapsedItem = $("#" + controls + "_c");
if (expandedItem.length && collapsedItem.length) {
if (expandedItem.is(":hidden")) {
expandedItem.toggle("fast");
collapsedItem.toggle("fast");
this.saveCollapsed(controls);
} else {
expandedItem.toggle("fast");
collapsedItem.toggle("fast");
this.saveCollapsed(controls, 1);
}
} else if (expandedItem.length && !collapsedItem.length) {
if (expandedItem.is(":hidden")) {
expandedItem.toggle("fast");
element.removeClass("collapse_collapsed").addClass("collapse")
.attr("alt", "[-]")
.attr("title", "[-]");
element.parent().parent('td').removeClass('tcat_collapse_collapsed');
element.parent().parent('.thead').removeClass('thead_collapsed');
this.saveCollapsed(controls);
} else {
expandedItem.toggle("fast");
element.removeClass("collapse").addClass("collapse_collapsed")
.attr("alt", "[+]")
.attr("title", "[+]");
element.parent().parent('td').addClass('tcat_collapse_collapsed');
element.parent().parent('.thead').addClass('thead_collapsed');
this.saveCollapsed(controls, 1);
}
}
return true;
};
});
</script>
Działa, super!
Da się jeszcze zaradzić coś na to, żeby po zwinięciu działu "ptaszek" z prawej zmieniał się na strzałkę w dół?
W CSS możesz zmienić atrybut dla klasy. Element zwinięty i rozwinięty ma inną klasę, więc wystarczy je ostylować. Zapewne już masz dodana strzałkę w CSS, więc dla rozwiniętej klasy wystarczy dodać transform z ustawionym rotate. Jestem jednak na telefonie i strzelam tutaj. Może nie masz tego w CSS a w HTML, nie mam jak zweryfikować. Musisz użyć opcji zbadaj element samemu
Z tego co widzę mam strzałkę w CSS, ale klasy chyba nie są ostylowane bo nie mogę ich znaleźć. Jak próbowałem dodać rotate do istniejących już klas albo ostylować nową, to cała kategoria obracała się o 180 stopni. Niestety nie ogarniam tego trochę, dla której dokładnie klasy powinienem zrobić styl z rotate?
W tym samym miejscu gdzie dajesz strzałkę zapewne. Ewentualnie musisz rozdzielić klasy jeśli dodajesz do dwóch. Użyj zbadaj element na strzałce, zwiń i rozwiń. Sprawdź jaka klasa się zmienia wtedy. Będziesz wiedział co dokładnie ostylować.
Na pc będę dopiero w następnym tygodniu, a z telefonu nie mam możliwości nakierować bardziej. Jak nie dasz rady to moze ktoś inny pomoże. W przeciwnym wypadku przypomnij się w przyszłym tygodniu (jakoś po środzie)
[
attachment=13525]
U góry zwinięty, na dole rozwinięty.
Próbowałem ostylować klasę "fa fa-angle-up fa-fw expander collapse_collapsed", ale nic się nie zmienia jak tam daję rotate.
Styluj samo collapse lub collapse_collapsed, pokaż jak próbujesz selektor zbudować jak nie pójdzie
Poradziłem sobie, "collapse_collapsed" zadziałał.
Dzięki wielkie!