Не работает ползунок цен в интернет-магазине
Добрый день!
Помоги разобраться, вроде все настроил, но все равно не работает ползунок цен в интернет-магазине. В чем может быть проблема? Сайт: https://fifaday.ru/shop/all Код: <div class="fg"> <div class="nav-cat"> <style>@import url(https://fifaday.ru/css/filter-sale.css);</style> <script src="https://fifaday.ru/js/jquery-ui.min.js"></script> <div class="flist-item" id="flist-item-price"><span class="flist-label" id="flist-label-price">Цена:</span> <input type="text" id="price_min" class="price_filter" value=""> <input type="text" id="price_max" class="price_filter" value=""> <button onclick="setPriceFilter();">Фильтровать</button> <button onclick="cancelPriceFilter();">Сбросить</button> <script type="text/javascript"> var shopFilterMinPrice = 0; var shopFilterMaxPrice = 300000; $('#price_min').on('change', function(){ var minEl = $(this); var maxEl = $('#price_max'); var minElVal = correctPriceFilterMinValue(minEl.val()); var maxElVal = correctPriceFilterMaxValue(maxEl.val()); if(minElVal > maxElVal){ minElVal = maxElVal; } minEl.val(minElVal); maxEl.val(maxElVal); }); $('#price_max').on('change', function(){ var minEl = $('#price_min'); var maxEl = $(this); var minElVal = correctPriceFilterMinValue(minEl.val()); var maxElVal = correctPriceFilterMaxValue(maxEl.val()); if(minEl.val()){ if(maxElVal < minElVal){ maxElVal = minElVal; } }else{ if(maxElVal < shopFilterMinPrice){ maxElVal = shopFilterMinPrice; } } minEl.val(minElVal); maxEl.val(maxElVal); }); function correctPriceFilterMinValue(val){ var inpMinVal = val; if(inpMinVal && /[^0-9]/.test(inpMinVal) == false){ inpMinVal = parseInt(inpMinVal); if(inpMinVal < shopFilterMinPrice){ inpMinVal = shopFilterMinPrice; } }else{ inpMinVal = shopFilterMinPrice; } return inpMinVal; } function correctPriceFilterMaxValue(val){ var inpMaxVal = val; if(inpMaxVal && /[^0-9]/.test(inpMaxVal) == false){ inpMaxVal = parseInt(inpMaxVal); if(inpMaxVal > shopFilterMaxPrice){ inpMaxVal = shopFilterMaxPrice; } }else{ inpMaxVal = shopFilterMaxPrice; } return inpMaxVal; } function setPriceFilter(){ var error = '', inpMinVal = $("#price_min").val(), inpMaxVal = $("#price_max").val(); if(inpMinVal == undefined || price_min == ''){ inpMinVal = 0; error += '<li>Не указано минимальное значение</li>'; }else{ if(inpMinVal < 0 || /[^0-9]/.test(inpMinVal) !== false){ inpMinVal = 0; error += '<li>Недопустимое минимальное значение. Допустимо только целочисленные положительные значения.</li>'; }else{ inpMinVal = parseInt(inpMinVal); if(inpMinVal > 100000000000000000){ error += '<li>Недопустимое минимальное значение. Слишком большое значение</li>'; } } } if(inpMaxVal == undefined || inpMaxVal == ''){ inpMaxVal = 0; error += '<li>Не указано максимальное значение</li>'; }else{ if(inpMaxVal < 0 || /[^0-9]/.test(inpMaxVal) !== false){ inpMaxVal = 0; error += '<li>Недопустимое максимальное значение. Допустимо только целочисленные положительные значения.</li>'; }else{ inpMaxVal = parseInt(inpMaxVal); if(inpMaxVal > 100000000000000000){ error += '<li>Недопустимое максимальное значение. Слишком большое значение</li>'; } } } if(inpMaxVal < inpMinVal){ error += '<li>Минимальное значение должно быть меньше максимального.</li>'; } if(!error){ return priceFilter('price', inpMinVal+'|'+inpMaxVal); }else{ shop_alert( '<ul>'+error+'</ul>', window.uCoz.shopSigns[210178], 'warning', 350, 120, {tm:8000, align:'left', icon:'img/warning.png'} ); } return false; } function cancelPriceFilter(){ priceFilter('price', ''); $("#price_min").val(''); $("#price_max").val(''); return false; } </script></div> <div id="price-range-zone"> <div id="price-range-2"></div> <div id="price-range-grid"></div> </div> <script> if($("#price_min").val()!='') { cancelPriceFilter(); } $("#price_min").val(shopFilterMinPrice); $("#price_max").val(shopFilterMaxPrice); $("#price-range-2").slider({ range: true, min: shopFilterMinPrice, max: shopFilterMaxPrice, values: [shopFilterMinPrice, shopFilterMaxPrice], step: 1, slide: function(event, ui){ $("#price_min").val(ui.values[0]); $("#price_max").val(ui.values[1]); }, change: function( event, ui ){ FiltGroup.fromHint = $('#price-range-zone'); return priceFilter('price', ui.values.join('|')), setTimeout(FiltGroup.postFilter, 1000); } }); $("#price-range-2").append('<span class="irs-min" style="visibility: hidden;"></span><span class="irs-max" style="visibility: hidden;"></span><span class="irs-from" style="visibility: visible; left: -3.125%;"></span><span class="irs-to" style="visibility: visible; left: 85.208333333%;"></span><span class="irs-single" style="visibility: hidden; left: 32.083333333%;"></span>'); $('.irs-min').html(shopFilterMinPrice).css({ 'left': '0%', 'margin-left': $('.irs-min').outerWidth() / -2 }); $('.irs-max').html(shopFilterMaxPrice).css({ 'left': '100%', 'margin-left': $('.irs-max').outerWidth() / -2 }); $('.irs-from').html(shopFilterMinPrice).css({ 'left': '0%', 'margin-left': $('.irs-from').outerWidth() / -2 }); $('.irs-to').html(shopFilterMaxPrice).css({ 'left': '100%', 'margin-left': $('.irs-to').outerWidth() / -2 }); $('.irs-single').html(shopFilterMinPrice + ' — ' + shopFilterMaxPrice); $("#price-range-grid").append('<span class="irs-grid" style="width: 97.8%; left: 1%;"><span class="irs-grid-pol" style="left: 0%"></span><span class="irs-grid-text js-grid-text-0" style="left: 0%;"></span><span class="irs-grid-pol small" style="left: 20%"></span><span class="irs-grid-pol small" style="left: 15%"></span><span class="irs-grid-pol small" style="left: 10%"></span><span class="irs-grid-pol small" style="left: 5%"></span><span class="irs-grid-pol" style="left: 25%"></span><span class="irs-grid-text js-grid-text-1" style="left: 25%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 45%"></span><span class="irs-grid-pol small" style="left: 40%"></span><span class="irs-grid-pol small" style="left: 35%"></span><span class="irs-grid-pol small" style="left: 30%"></span><span class="irs-grid-pol" style="left: 50%"></span><span class="irs-grid-text js-grid-text-2" style="left: 50%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 70%"></span><span class="irs-grid-pol small" style="left: 65%"></span><span class="irs-grid-pol small" style="left: 60%"></span><span class="irs-grid-pol small" style="left: 55%"></span><span class="irs-grid-pol" style="left: 75%"></span><span class="irs-grid-text js-grid-text-3" style="left: 75%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 95%"></span><span class="irs-grid-pol small" style="left: 90%"></span><span class="irs-grid-pol small" style="left: 85%"></span><span class="irs-grid-pol small" style="left: 80%"></span><span class="irs-grid-pol" style="left: 100%"></span><span class="irs-grid-text js-grid-text-4" style="left: 100%;"></span></span>'); for (var i = 0; i <= 4; i++) { $('.js-grid-text-' + i).html( Math.round(shopFilterMaxPrice / 4 * i) ).css({ 'margin-left': $('.js-grid-text-' + i).outerWidth() / -2 }); } function normaliseHint () { $('.irs-from').html( $("#price_min").val() ).css({ 'left': $('.ui-slider-handle').eq(0).position().left, 'margin-left': $('.irs-from').outerWidth() / -2 }); $('.irs-to').html( $("#price_max").val() ).css({ 'left': $('.ui-slider-handle').eq(1).position().left, 'margin-left': $('.irs-to').outerWidth() / -2 }); var s = $('.ui-slider-handle').eq(1).position().left - $('.ui-slider-handle').eq(0).position().left; $('.irs-single').html($("#price_min").val() + ' — ' + $("#price_max").val()).css({ 'left': $('.ui-slider-handle').eq(0).position().left + (s / 2), 'margin-left': $('.irs-single').outerWidth() / -2 }); var w = $('.irs-single').outerWidth(); if (w > s) { $('.irs-from, .irs-to').css({visibility: 'hidden', opacity: 0}); $('.irs-single').css({visibility: 'visible', opacity: 1}); } else { $('.irs-from, .irs-to').css({visibility: 'visible', opacity: 1}); $('.irs-single').css({visibility: 'hidden', opacity: 0}); } var w_min = $('.irs-min').outerWidth(); if ($('.irs-from').position().left > w_min) { $('.irs-min').css({visibility: 'visible', opacity: 1}); } else { $('.irs-min').css({visibility: 'hidden', opacity: 0}); } var w_max = $('.irs-min').outerWidth(); if ( $('#price-range-2').width() - $('.irs-to').position().left > w_max) { $('.irs-max').css({visibility: 'visible', opacity: 1}); } else { $('.irs-max').css({visibility: 'hidden', opacity: 0}); } } $(document).mousemove(function () { normaliseHint(); setTimeout(normaliseHint, 160); }); </script> </ul> </div> Спасибо! |
Часовой пояс GMT +3, время: 12:33. |