jQuery range slider

Design help General
1

Hi there! I want implement range slider with two controls, like this: Аренда офиса в Москве - Все предложения по аренде офисных помещений в Москве (Снять офис г. Москва) – Yandex.png (11 kb) storage.node.show.title2 25 июня 2014 г. Joxi

How can i do that?

2

Hi, give the below a try, it may not be exactly what you are looking for, but may help to point you in a possible direction. Without knowing what kind of custom code that site is using, it is hard to say, it could be any kind of custom code solution. Webflow does not have this element that you can add from the Designer, but maybe in the future.

Step 1: Create a Div on your page, with the Unique ID set in Settings Panel, to “slider”
Step 2: Go to Site Settings → Custom Code
Step 3: Add this code to your Before Body section of your page:

<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
$(document).ready(function() {
      $( "#slider" ).slider();
  });
</script>

Save all changes, Re-publish site.

Try that and see if it works for you. That is the jQuery range slider that you can then control in your page. See more on this at:

I hope this helps, Cheers!

UPDATE: The original code I posted, had a typo. Really big thank you to @kirillgreen for keeping me on my toes :smile:

2 Likes
3

Dave, thank You for answer. I did it exactly like You wrote, but it does not work: http://arenda-ofisa.webflow.com/

4

Oh, i see. The code need to be saved in the head :slight_smile:

5

Hi, that code should work in the Before Body section, and normally you should put all your javascript references in the Before Body section (whenever possible) but I made a typo in the code, so I have corrected that.

Cheers and thanks for spotting this.

Dave