{"action":"closed","issue":{"url":"https://api.github.com/repos/twbs/bootstrap/issues/20922","repository_url":"https://api.github.com/repos/twbs/bootstrap","labels_url":"https://api.github.com/repos/twbs/bootstrap/issues/20922/labels{/name}","comments_url":"https://api.github.com/repos/twbs/bootstrap/issues/20922/comments","events_url":"https://api.github.com/repos/twbs/bootstrap/issues/20922/events","html_url":"https://github.com/twbs/bootstrap/issues/20922","id":183401816,"number":20922,"title":"tooltip&popover offset option","user":{"login":"publicocean0","id":2518180,"avatar_url":"https://avatars.githubusercontent.com/u/2518180?v=3","gravatar_id":"","url":"https://api.github.com/users/publicocean0","html_url":"https://github.com/publicocean0","followers_url":"https://api.github.com/users/publicocean0/followers","following_url":"https://api.github.com/users/publicocean0/following{/other_user}","gists_url":"https://api.github.com/users/publicocean0/gists{/gist_id}","starred_url":"https://api.github.com/users/publicocean0/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/publicocean0/subscriptions","organizations_url":"https://api.github.com/users/publicocean0/orgs","repos_url":"https://api.github.com/users/publicocean0/repos","events_url":"https://api.github.com/users/publicocean0/events{/privacy}","received_events_url":"https://api.github.com/users/publicocean0/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/twbs/bootstrap/labels/feature","name":"feature","color":"4bb14b"},{"url":"https://api.github.com/repos/twbs/bootstrap/labels/js","name":"js","color":"ffc40d"}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2016-10-17T12:24:10Z","updated_at":"2016-10-18T02:44:30Z","closed_at":"2016-10-18T02:44:30Z","body":"hi , i suggest to add another option shiftOffset{x:number,y:number} \r\nso i can shift in relative way the position of tooltip/popover from the default calculated position(very simple modification very usefull)\r\n\r\nBotton the modified file\r\n<pre><![CDATA[\r\n\r\n\r\nTooltip.DEFAULTS = {\r\n    animation: true,\r\n    placement: 'top',\r\n    selector: false,\r\n    template: '<div class=\"tooltip\" role=\"tooltip\"><div class=\"tooltip-arrow\"></div><div class=\"tooltip-inner\"></div></div>',\r\n    trigger: 'hover focus',\r\n    title: '',\r\n    delay: 0,\r\n   <b> shiftOffset:{x:0,y:0}</b>,\r\n    html: false,\r\n    container: false,\r\n    viewport: {\r\n      selector: 'body',\r\n      padding: 0\r\n    }\r\n  }\r\n\r\n\r\n  Tooltip.prototype.show = function () {\r\n    var e = $.Event('show.bs.' + this.type)\r\n\r\n    if (this.hasContent() && this.enabled) {\r\n      this.$element.trigger(e)\r\n\r\n      var inDom = $.contains(this.$element[0].ownerDocument.documentElement, this.$element[0])\r\n      if (e.isDefaultPrevented() || !inDom) return\r\n      var that = this\r\n\r\n      var $tip = this.tip()\r\n\r\n      var tipId = this.getUID(this.type)\r\n\r\n      this.setContent()\r\n      $tip.attr('id', tipId)\r\n      this.$element.attr('aria-describedby', tipId)\r\n\r\n      if (this.options.animation) $tip.addClass('fade')\r\n\r\n      var placement = typeof this.options.placement == 'function' ?\r\n        this.options.placement.call(this, $tip[0], this.$element[0]) :\r\n        this.options.placement\r\n\r\n      var autoToken = /\\s?auto?\\s?/i\r\n      var autoPlace = autoToken.test(placement)\r\n      if (autoPlace) placement = placement.replace(autoToken, '') || 'top'\r\n\r\n      $tip\r\n        .detach()\r\n        .css({ top: 0, left: 0, display: 'block' })\r\n        .addClass(placement)\r\n        .data('bs.' + this.type, this)\r\n\r\n      this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)\r\n      this.$element.trigger('inserted.bs.' + this.type)\r\n\r\n      var pos          = this.getPosition()\r\n      var actualWidth  = $tip[0].offsetWidth\r\n      var actualHeight = $tip[0].offsetHeight\r\n\r\n      if (autoPlace) {\r\n        var orgPlacement = placement\r\n        var viewportDim = this.getPosition(this.$viewport)\r\n\r\n        placement = placement == 'bottom' && pos.bottom + actualHeight > viewportDim.bottom ? 'top'    :\r\n                    placement == 'top'    && pos.top    - actualHeight < viewportDim.top    ? 'bottom' :\r\n                    placement == 'right'  && pos.right  + actualWidth  > viewportDim.width  ? 'left'   :\r\n                    placement == 'left'   && pos.left   - actualWidth  < viewportDim.left   ? 'right'  :\r\n                    placement\r\n\r\n        $tip\r\n          .removeClass(orgPlacement)\r\n          .addClass(placement)\r\n      }\r\n\r\n      var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)\r\n      <b>var shiftOffset=(typeof (this.options.shiftOffset)=='function')?this.options.shiftOffset():this.options.shiftOffset;\r\n      calculatedOffset.top  += shiftOffset.y;\r\n      calculatedOffset.left += shiftOffset.x;\r\n      </b>this.applyPlacement(calculatedOffset, placement)\r\n\r\n      var complete = function () {\r\n        var prevHoverState = that.hoverState\r\n        that.$element.trigger('shown.bs.' + that.type)\r\n        that.hoverState = null\r\n\r\n        if (prevHoverState == 'out') that.leave(that)\r\n      }\r\n\r\n      $.support.transition && this.$tip.hasClass('fade') ?\r\n        $tip\r\n          .one('bsTransitionEnd', complete)\r\n          .emulateTransitionEnd(Tooltip.TRANSITION_DURATION) :\r\n        complete()\r\n    }\r\n  }\r\n\r\n]]></pre>"}}
{"actor":{"display_login":"mdo"}}