Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] jQuery Slider - In eine Richtung sperren

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Trainmaster
    hat ein Thema erstellt [Erledigt] jQuery Slider - In eine Richtung sperren.

    [Erledigt] jQuery Slider - In eine Richtung sperren

    Ich bastle gerade einen Konfigurator mithilfe von jQuery. Es soll möglich sein, aus verschiedenen Produkten ein Produkt mit 100% Füllinhalt zu konfigurieren.

    Jetzt stehe ich vor folgendem Problem. Setze ich bspw. Regler A auf 60% und Regler B auf 40%, ist das Produkt fertig konfiguriert. Die anderen Regler werden dabei deaktiviert. Allerdings möchte ich gerne, dass die Regler A und B in die positive Richtung ebenfalls deaktiviert werden bzw. diese nur mehr in die negative Richtung geschoben werden können.

    Im jQuery Forum habe ich bereits gesucht, allerdings hilft mir die Antwort nicht weiter Lock slider to only one direction? - jQuery Forum . Bei Google findet man ebenfalls recht wenig / nichts dazu.

    Ein weiteres Problem habe ich mit dem Event "slide". Das Event wird bei jeder Mausbewegung ausgelöst. Damit lasse ich mir über
    PHP-Code:
    $("#amount_'.$i.'").html(ui.value); 
    den aktuellen Slider-Wert des jeweiligen Sliders ausgeben.

    Versuche ich den Gesamtwert aller Slider darzustellen, hinkt der Wert immer um eine Mausbewegung nach, d.h. steht der Slider auf 50, Gesamtwert auf 0 - Slider auf 100, Gesamtwert auf 50 usw.

    PHP-Code:
    var total 0;
    for (var 
    0<= '.count($result).'i++) {                                                    
       var 
    slider_num "#slider_" i;
       var 
    total total + $(slider_num).slider("value");                        


  • Gast-Avatar
    Ein Gast antwortete
    @ nikosch: You made my day.

    Habe es endlich so hinbekommen, wie ich es haben möchte. Die ersten Schritte in Javascript sind zäh, aber es geht

    Da ich hier täglich dazulerne, teile ich gerne meine Lösung:

    PHP-Code:
    $(document).ready(function() {                                    
        $(
    "#progressbar").progressbar({ value});
        $(
    ".slider").each(function(indexelement) {
            var 
    name element.id.replace("Slider""");
            $(
    "#" element.id).slider({
                
    animatetrue,
                
    min0,
                
    max500,
                
    step50,
                
    value0,
                
    slide: function(eventui) {            
                    var 
    totalValue 0;                                    
                    
    currentSlider = $(this).attr("id");
                    
                    for (var 
    1<= '.count($result).'i++) {
                        var 
    eachSlider "s" "Slider";
                        $(
    "#" eachSlider).slider("enable");                                                                
                        if (
    eachSlider == currentSlider) {
                            
    totalValue += ui.value;
                        } else {
                            
    totalValue += $("#" eachSlider).slider("option""value");
                        }
                    }
                    
                    if (
    totalValue >= 500) {
                        for (var 
    1<= '.count($result).'i++) {
                            var 
    eachSlider "s" "Slider";                                                            
                            if (!(
    eachSlider == currentSlider)) {
                                if ($(
    "#" eachSlider).slider("option""value") == 0) {
                                    $(
    "#" eachSlider).slider("disable");
                                }
                            }                        
                        }                                                     
                    }
                    
                    if (
    totalValue 500) {
                        return 
    false;
                    }
                    
                    
    totalValueInt parseInt(totalValue);
                    $(
    "#" name).html(ui.value);
                    $(
    "#mix").html(totalValueInt);                                            
                    $(
    "#progressbar").progressbar("option""value"totalValueInt 5);
                }
            });
        });        
    }); 

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    allerdings hilft mir die Antwort nicht weiter Lock slider to only one direction? - jQuery Forum .
    Warum nicht? Was ist Dein Problem mit der ANtwort?

    [edit]
    Im Grunde ist es doch ganz einfach (Pseudocode):

    Code:
    onSlide = test;
    
    test(){
      bilde SUmme aller Regler()
      wenn Summe >= 100
        return false;
    }
    Sollte bereits die Sperre umsetzen. Wenn Du denn das Deaktivieren noch machen willst - ist aber an sich nicht nötig - käme vor dem return noch (Pseudocode):
    Code:
    für alle slider:
      setze deaktiv, wenn wert == 0
    und nach dem return:
    Code:
    für alle slider:
      setze aktiv

    Einen Kommentar schreiben:

Lädt...
X