Skip to content

Wrapper width show part of the second option in Edge  #729

@perimontu

Description

@perimontu

Hello guys, thank you for you work.

If you open the demo fiddle of yours on microsoft edge: https://jsfiddle.net/djibe89/vL87w0j8/ and go to the "Checked by default, secondary color when toggled, grey when idle." part, click on the bootstrap-swicth with the magenta "ON". You will see a small magenta border on the right.
Remember to check it out with Microsoft Edge.

image

I've made a workaround in "value: function _width() {", I think that you could do better.

{
      key: '_width',
      value: function _width() {
        var _this2 = this;

        var $handles = this.$on.add(this.$off).add(this.$label).css('width', '');
        var handleWidth = this.options.handleWidth === 'auto' ? Math.round(Math.max(this.$on.width(), this.$off.width())) : this.options.handleWidth;
        $handles.width(handleWidth);
        this.$label.width(function (index, width) {
          if (_this2.options.labelWidth !== 'auto') {
            return _this2.options.labelWidth;
          }
          if (width < handleWidth) {
            return handleWidth;
          }
          return width;
        });
        this._handleWidth = this.$on.outerWidth();
        this._labelWidth = this.$label.outerWidth();
        this.$container.width(this._handleWidth * 2 + this._labelWidth);
        return this.$wrapper.width((this._handleWidth + this._labelWidth)-2); //just stripe two pixels
      }
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions