jquery UI 슬라이더의 값을 기준으로 div 표시/숨기기

Question

jQuery UI 슬라이더를 사용하고 슬라이더가 특정 값에 도달했을 때 div를 표시하려고하고 그렇지 않으면 div를 표시하려고합니다. div가 예기치 않은 순간에 표시되거나 숨겨집니다. 누구든지 내가 구문이 잘못되어 가고있는 곳을 찾아 낼 수 있습니까? 다음은 스크립트의 :

$(function() { 

    //vars 
    var conveyor = $(".content-conveyor", $("#sliderContent")), 
    item = $(".item", $("#sliderContent")); 

    //set length of conveyor 
    conveyor.css("width", item.length * parseInt(item.css("width"))); 

    //config 
    var sliderOpts = { 
     max: (item.length * parseInt(item.css("width"))) - parseInt($(".viewer", $("#sliderContent")).css("width")),orientation: "vertical",range: "min",step: 304, 
     slide: function(e, ui) { 
     conveyor.css("left", "-" + ui.value + "px"); 
     $("#amount").val('$' + ui.value); 

     // here's where I'm trying to show and hide a div based on the value of the slider 
     if ($("#slider").slider("value") == 304) { 
     $("#test").show(); 
     } else { 
     $("#test").hide();  
     } 
     } 
    }; 

    //create slider 
    $("#slider").slider(sliderOpts); 
    $("#amount").val('$' + $("#slider").slider("value")); 

    }); 

Answer 1

내가 최근 프로젝트에 대한 이런 짓을하지만, 내 사용자에게 경고 참고로 span 태그를 보여주는데, 다음은 내가 사용하는 코드는 미세한의 작품 :

  $("#slider").slider({ 
       animate: true, 
       min: 0, 
       max: 10000, 
       range: true, 
       slide: function(event, ui) { 
        $("#amount").val(ui.values[1]); 
        if (ui.values[1] > '2000') { //2000 is the amount where you want the event to trigger 
         $('.slider-warning').css('display', 'block'); 
        } else { 
         $('.slider-warning').css('display', 'none'); 
        } 
       } 
      }); 

그래서 당신은이를 사용할 수 있지만 모든 necesary 속성 값을 즉, 변경 할 수 있어야하고, 셀렉터 등

편집 - 업데이트 된 대답은

다음

에서, ui.values은 잘못이 통해 UR 코드에서 직접 촬영

var sliderOpts = { 
      max: (item.length * parseInt(item.css("width"))) - parseInt($(".viewer", $("#sliderContent")).css("width")), 
      orientation: "vertical", 
      range: "min", 
      step: 304, 
      slide: function(event, ui) { 
       conveyor.css("left", "-" + ui.value + "px"); 
       $("#amount").val('$' + ui.value); 
       if (ui.value > '200') { //200 is the amount where you want the event to trigger 
        $('#test').css('display', 'block'); 
       } else { 
        $('#test').css('display', 'none'); 
       } 
      } 
     }; 

수정 된 코드를 검색 할 그것을 가지고, 또한주의 사항 :

if (ui.value > '200') 

당신이로 변경해야합니다 어떻게하면 이벤트가 트리거되기를 원할 것입니다.

희망이 도움이 :)