[3.2] Latte - Counter Badge
Verfasst: 27.06.2019 19:38
Hallo,
ich verwende das Theme Latte.
Forum: Pendragon
Ich möchte für einen Navigations-Tab einen Counter anzeigen, der genauso wie z.B. der Private Messages Counter aussehen soll:
[ externes Bild ]
Die Zahl (".bubble" Span) für den Counter lade ich über die overall_header.html von einer, in das Forum integrierten Software EQDKP-PLUS, in den ".counter.auction-count" Span der navbar_header.html:
So sieht das Ergebnis der navbar_header.html aus:
Leider wird der Counter auf diese Weise auch dann angezeigt, wenn die Zahl 0 ist.
Meine Frage ist, wie ich für die jeweilige Zahl aus dem ".bubble" Span eine "Variable" erstellen kann, die ich konform zu {PRIVATE_MESSAGE_COUNT} verwenden könnte:
Also beispielsweise so:
Ich habe es auch schon mit JS in der overall_header.html versucht (".non-zero" Klasse entfernen, wenn ".bubble" Zahl = 0) aber das funktioniert nur mit fiddle, nicht im Forum selbst:
oder
Leider bin ich kein Profi und stehe nun komplett an. Habt ihr einen Tip für mich?
Liebe Grüße,
Neverlands
ich verwende das Theme Latte.
Forum: Pendragon
Ich möchte für einen Navigations-Tab einen Counter anzeigen, der genauso wie z.B. der Private Messages Counter aussehen soll:
[ externes Bild ]
Die Zahl (".bubble" Span) für den Counter lade ich über die overall_header.html von einer, in das Forum integrierten Software EQDKP-PLUS, in den ".counter.auction-count" Span der navbar_header.html:
Code: Alles auswählen
<script>
$(function (){
$(".auction-count").load("/eqdkp_plus/Guildbank.html .bubble");
});
</script>
Code: Alles auswählen
<li class="tab auktionen responsive-hide non-zero selected" data-responsive-class="small-icon icon-gavel" data-select-match="auktionen" data-responsive-index="-1">
<a class="nav-link" href="/auktionen">Auktionen</a>
<strong>
<span class="counter auction-count"><span class="bubble">1</span></span>
<span class="arrow"></span>
</strong>
</li>
Meine Frage ist, wie ich für die jeweilige Zahl aus dem ".bubble" Span eine "Variable" erstellen kann, die ich konform zu {PRIVATE_MESSAGE_COUNT} verwenden könnte:
navbar_header.html
Code: Alles auswählen
<li class="tab pm<!-- IF PRIVATE_MESSAGE_COUNT > 0 --> non-zero<!-- ENDIF -->" data-skip-responsive="true" data-select-match="pm">
<a class="nav-link" href="{U_PRIVATEMSGS}" role="menuitem">{L_PRIVATE_MESSAGES}</a>
<strong>
<span class="counter">{PRIVATE_MESSAGE_COUNT}</span>
<span class="arrow"></span>
</strong>
</li>
Code: Alles auswählen
<li class="tab auktionen responsive-hide<!-- IF AUCTION_COUNT > 0 --> non-zero<!-- ENDIF --> selected" data-responsive-class="small-icon icon-gavel" data-select-match="auktionen" data-responsive-index="-1">
<a class="nav-link" href="/auktionen">Auktionen</a>
<strong>
<span class="counter auction-count"><span class="bubble">{AUCTION_COUNT}</span></span>
<span class="arrow"></span>
</strong>
</li>
Code: Alles auswählen
<script>
$( document ).ready(function() {
var value = document.getElementsByClassName("bubble").innerHTML == "0";
if (!value) {
alert( "Test ist mindestens 1" );
$('li.auktionen').removeAttr("title");
} else {
alert( "Count value is 0!" );
$('li.auktionen > strong').remove();
$('li.auktionen').removeClass('non-zero').removeAttr("title");
}
});
</script>
Code: Alles auswählen
<script>
$( document ).ready(function() {
var value = $('.bubble').text() == "0";
if (!value) {
alert( "Test ist mindestens 1" );
$('li.auktionen').removeAttr("title");
} else {
alert( "Count value is 0!" );
$('li.auktionen > strong').remove();
$('li.auktionen').removeClass('non-zero').removeAttr("title");
}
});
</script>
Liebe Grüße,
Neverlands