Menu icon Foundation
Use 5.5.3 range slider in 6?

Hey there. Is there any way I would be able to use the range slider js from 5.5.3 in Foundation 6? I tried putting the separate slider.js file in, but no go. Thank you!

range slider5.5.366.0.1

Hey there. Is there any way I would be able to use the range slider js from 5.5.3 in Foundation 6? I tried putting the separate slider.js file in, but no go. Thank you!

Tim Hartwick almost 4 years ago

Hm, I would guess that it's possible. Can you make sure that all of the Foundation 6 slider JS is outta there? I believe it's pretty portable. If you've tried that, are you receiving any errors?

Jim Christenson almost 4 years ago

Thank you so much for the reply, Tim! So what I have tried to do is build a basic foundation 6. Just to be sure, the only thing I took was the grid. I take my functioning Foundation 5 page, and just swap out the foundation.js files. The slider from 5 is a separate js file that is still being included.

The errors I get when trying to use the page are below. It looks like "reflow" is not being recognized by the foundation.js 6, and it looks like something is deprecated, but that may or may not be related.

-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
TypeError: Foundation.libs is undefined

reflow : function () {

foundattionslider.js (line 280, col 5)
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
TypeError: We're sorry, 'object' is not a valid parameter. You must use a
string representing the method you wish to invoke.

Error: "throw $continue" is deprecated, use "return" instead

-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-

Jim Christenson almost 4 years ago

This is where the reflow is comming into play in foundation.slider.js

 reflow : function () {
  var self = this;
  self.S('[' + this.attr_name() + ']').each(function () {
    var handle = $(this).children('.range-slider-handle')[0],
        val = $(this).attr(self.attr_name());
    self.initialize_settings(handle);

    if (val) {
      self.set_ui($(handle), parseFloat(val));
    } else {
      self.set_initial_position($(this));
    }
  });