Skip to content
This repository has been archived by the owner on Jun 14, 2020. It is now read-only.

Commit

Permalink
Fixed viewport positioning issue when tip enabled
Browse files Browse the repository at this point in the history
  • Loading branch information
@Craga89
Craga89 committed May 31, 2011
1 parent 5762f7d commit 397be22
Show file tree
Hide file tree
Showing 7 changed files with 53 additions and 52 deletions.
27 changes: 13 additions & 14 deletions dist/jquery.qtip.basic.js
View file
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Tue May 31 18:14:52 2011 +0100
* Date: Tue May 31 18:27:18 2011 +0100
*/

/*jslint browser: true, onevar: true, undef: true, nomen: true, bitwise: true, regexp: true, newcap: true, immed: true, strict: true */
Expand Down Expand Up @@ -1064,35 +1064,34 @@ function QTip(target, options, id, attr)
fixed = tooltip.css('position') === 'fixed',
viewport = posOptions.viewport,
position = { left: 0, top: 0 },
tip = (self.plugins.tip || {}).corner,
tip = self.plugins.tip,
readjust = {
// Repositioning method and axis detection
horizontal: method[0],
vertical: method[1] || method[0],
tip: options.style.tip || {},

// Reposition methods
left: function(posLeft) {
var isShift = readjust.horizontal === 'shift',
viewportScroll = viewport.offset.left + viewport.scrollLeft,
myWidth = my.x === 'left' ? elemWidth : my.x === 'right' ? -elemWidth : -elemWidth / 2,
atWidth = at.x === 'left' ? targetWidth : at.x === 'right' ? -targetWidth : -targetWidth / 2,
tipWidth = (readjust.tip.width + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft - tipAdjust,
tipWidth = tip ? tip.size.width || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft + tipAdjust,
overflowRight = posLeft + elemWidth - viewport.width - viewportScroll + tipAdjust,
offset = myWidth - (my.precedance === 'x' || my.x === my.y ? atWidth : 0),
isCenter = my.x === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'y' ? tipWidth : 0;
tipAdjust = tip && tip.corner.precedance === 'y' ? tipWidth : 0;
offset = (my.x === 'left' ? 1 : -1) * myWidth - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.left += overflowLeft > 0 ? overflowLeft : overflowRight > 0 ? -overflowRight : 0;
position.left = Math.max(
viewport.offset.left + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.left + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posLeft - offset,
Math.min(
Math.max(viewport.offset.left + viewport.width, posLeft + offset),
Expand Down Expand Up @@ -1122,22 +1121,22 @@ function QTip(target, options, id, attr)
viewportScroll = viewport.offset.top + viewport.scrollTop,
myHeight = my.y === 'top' ? elemHeight : my.y === 'bottom' ? -elemHeight : -elemHeight / 2,
atHeight = at.y === 'top' ? targetHeight : at.y === 'bottom' ? -targetHeight : -targetHeight / 2,
tipHeight = (readjust.tip.height + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop - tipAdjust,
tipHeight = tip ? tip.size.height || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop + tipAdjust,
overflowBottom = posTop + elemHeight - viewport.height - viewportScroll + tipAdjust,
offset = myHeight - (my.precedance === 'y' || my.x === my.y ? atHeight : 0),
isCenter = my.y === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'x' ? tipHeight : 0;
tipAdjust = tip && tip.corner.precedance === 'x' ? tipHeight : 0;
offset = (my.y === 'top' ? 1 : -1) * myHeight - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.top += overflowTop > 0 ? overflowTop : overflowBottom > 0 ? -overflowBottom : 0;
position.top = Math.max(
viewport.offset.top + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.top + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posTop - offset,
Math.min(
Math.max(viewport.offset.top + viewport.height, posTop + offset),
Expand Down
2 changes: 1 addition & 1 deletion dist/jquery.qtip.css
View file
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Tue May 31 18:14:52 2011 +0100
* Date: Tue May 31 18:27:18 2011 +0100
*/

/* Core qTip styles */
Expand Down
35 changes: 18 additions & 17 deletions dist/jquery.qtip.js
View file
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Tue May 31 18:14:52 2011 +0100
* Date: Tue May 31 18:27:18 2011 +0100
*/

/*jslint browser: true, onevar: true, undef: true, nomen: true, bitwise: true, regexp: true, newcap: true, immed: true, strict: true */
Expand Down Expand Up @@ -1064,35 +1064,34 @@ function QTip(target, options, id, attr)
fixed = tooltip.css('position') === 'fixed',
viewport = posOptions.viewport,
position = { left: 0, top: 0 },
tip = (self.plugins.tip || {}).corner,
tip = self.plugins.tip,
readjust = {
// Repositioning method and axis detection
horizontal: method[0],
vertical: method[1] || method[0],
tip: options.style.tip || {},

// Reposition methods
left: function(posLeft) {
var isShift = readjust.horizontal === 'shift',
viewportScroll = viewport.offset.left + viewport.scrollLeft,
myWidth = my.x === 'left' ? elemWidth : my.x === 'right' ? -elemWidth : -elemWidth / 2,
atWidth = at.x === 'left' ? targetWidth : at.x === 'right' ? -targetWidth : -targetWidth / 2,
tipWidth = (readjust.tip.width + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft - tipAdjust,
tipWidth = tip ? tip.size.width || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft + tipAdjust,
overflowRight = posLeft + elemWidth - viewport.width - viewportScroll + tipAdjust,
offset = myWidth - (my.precedance === 'x' || my.x === my.y ? atWidth : 0),
isCenter = my.x === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'y' ? tipWidth : 0;
tipAdjust = tip && tip.corner.precedance === 'y' ? tipWidth : 0;
offset = (my.x === 'left' ? 1 : -1) * myWidth - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.left += overflowLeft > 0 ? overflowLeft : overflowRight > 0 ? -overflowRight : 0;
position.left = Math.max(
viewport.offset.left + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.left + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posLeft - offset,
Math.min(
Math.max(viewport.offset.left + viewport.width, posLeft + offset),
Expand Down Expand Up @@ -1122,22 +1121,22 @@ function QTip(target, options, id, attr)
viewportScroll = viewport.offset.top + viewport.scrollTop,
myHeight = my.y === 'top' ? elemHeight : my.y === 'bottom' ? -elemHeight : -elemHeight / 2,
atHeight = at.y === 'top' ? targetHeight : at.y === 'bottom' ? -targetHeight : -targetHeight / 2,
tipHeight = (readjust.tip.height + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop - tipAdjust,
tipHeight = tip ? tip.size.height || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop + tipAdjust,
overflowBottom = posTop + elemHeight - viewport.height - viewportScroll + tipAdjust,
offset = myHeight - (my.precedance === 'y' || my.x === my.y ? atHeight : 0),
isCenter = my.y === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'x' ? tipHeight : 0;
tipAdjust = tip && tip.corner.precedance === 'x' ? tipHeight : 0;
offset = (my.y === 'top' ? 1 : -1) * myHeight - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.top += overflowTop > 0 ? overflowTop : overflowBottom > 0 ? -overflowBottom : 0;
position.top = Math.max(
viewport.offset.top + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.top + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posTop - offset,
Math.min(
Math.max(viewport.offset.top + viewport.height, posTop + offset),
Expand Down Expand Up @@ -2007,7 +2006,9 @@ function Tip(qTip, command)

self.corner = NULL;
self.mimic = NULL;
self.position = {};
self.border = border;
self.offset = opts.offset;
self.size = size;

// Add new option checks for the plugin
qTip.checks.tip = {
Expand Down Expand Up @@ -2328,14 +2329,14 @@ function Tip(qTip, command)
self.detectColours();

// Detect border width, taking into account colours
border = color.border === 'transparent' || color.border === '#123456' ? 0 :
self.border = border = color.border === 'transparent' || color.border === '#123456' ? 0 :
opts.border === TRUE ? borderWidth(corner, NULL, TRUE) : opts.border;

// Calculate coordinates
coords = calculateTip(mimic, width , height);

// Determine tip size
newSize = calculateSize(corner);
self.size = newSize = calculateSize(corner);
tip.css(newSize);

// Calculate tip translation
Expand Down
4 changes: 2 additions & 2 deletions dist/jquery.qtip.min.js
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/jquery.qtip.pack.js
View file

Large diffs are not rendered by default.

25 changes: 12 additions & 13 deletions src/core.js
View file
Expand Up @@ -1023,35 +1023,34 @@ function QTip(target, options, id, attr)
fixed = tooltip.css('position') === 'fixed',
viewport = posOptions.viewport,
position = { left: 0, top: 0 },
tip = (self.plugins.tip || {}).corner,
tip = self.plugins.tip,
readjust = {
// Repositioning method and axis detection
horizontal: method[0],
vertical: method[1] || method[0],
tip: options.style.tip || {},

// Reposition methods
left: function(posLeft) {
var isShift = readjust.horizontal === 'shift',
viewportScroll = viewport.offset.left + viewport.scrollLeft,
myWidth = my.x === 'left' ? elemWidth : my.x === 'right' ? -elemWidth : -elemWidth / 2,
atWidth = at.x === 'left' ? targetWidth : at.x === 'right' ? -targetWidth : -targetWidth / 2,
tipWidth = (readjust.tip.width + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft - tipAdjust,
tipWidth = tip ? tip.size.width || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'x' && !isShift ? tipWidth : 0,
overflowLeft = viewportScroll - posLeft + tipAdjust,
overflowRight = posLeft + elemWidth - viewport.width - viewportScroll + tipAdjust,
offset = myWidth - (my.precedance === 'x' || my.x === my.y ? atWidth : 0),
isCenter = my.x === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'y' ? tipWidth : 0;
tipAdjust = tip && tip.corner.precedance === 'y' ? tipWidth : 0;
offset = (my.x === 'left' ? 1 : -1) * myWidth - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.left += overflowLeft > 0 ? overflowLeft : overflowRight > 0 ? -overflowRight : 0;
position.left = Math.max(
viewport.offset.left + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.left + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posLeft - offset,
Math.min(
Math.max(viewport.offset.left + viewport.width, posLeft + offset),
Expand Down Expand Up @@ -1081,22 +1080,22 @@ function QTip(target, options, id, attr)
viewportScroll = viewport.offset.top + viewport.scrollTop,
myHeight = my.y === 'top' ? elemHeight : my.y === 'bottom' ? -elemHeight : -elemHeight / 2,
atHeight = at.y === 'top' ? targetHeight : at.y === 'bottom' ? -targetHeight : -targetHeight / 2,
tipHeight = (readjust.tip.height + readjust.tip.border * 2) || 0,
tipAdjust = tip && tip.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop - tipAdjust,
tipHeight = tip ? tip.size.height || 0 : 0,
tipAdjust = tip && tip.corner.precedance === 'y' && !isShift ? tipHeight : 0,
overflowTop = viewportScroll - posTop + tipAdjust,
overflowBottom = posTop + elemHeight - viewport.height - viewportScroll + tipAdjust,
offset = myHeight - (my.precedance === 'y' || my.x === my.y ? atHeight : 0),
isCenter = my.y === 'center';

// Optional 'shift' style repositioning
if(isShift) {
tipAdjust = tip && tip.precedance === 'x' ? tipHeight : 0;
tipAdjust = tip && tip.corner.precedance === 'x' ? tipHeight : 0;
offset = (my.y === 'top' ? 1 : -1) * myHeight - tipAdjust;

// Adjust position but keep it within viewport dimensions
position.top += overflowTop > 0 ? overflowTop : overflowBottom > 0 ? -overflowBottom : 0;
position.top = Math.max(
viewport.offset.top + (tipAdjust && tip.x === 'center' ? readjust.tip.offset : 0),
viewport.offset.top + (tipAdjust && tip.corner.x === 'center' ? tip.offset : 0),
posTop - offset,
Math.min(
Math.max(viewport.offset.top + viewport.height, posTop + offset),
Expand Down
8 changes: 5 additions & 3 deletions src/tips.js
View file
Expand Up @@ -45,7 +45,9 @@ function Tip(qTip, command)

self.corner = NULL;
self.mimic = NULL;
self.position = {};
self.border = border;
self.offset = opts.offset;
self.size = size;

// Add new option checks for the plugin
qTip.checks.tip = {
Expand Down Expand Up @@ -366,14 +368,14 @@ function Tip(qTip, command)
self.detectColours();

// Detect border width, taking into account colours
border = color.border === 'transparent' || color.border === '#123456' ? 0 :
self.border = border = color.border === 'transparent' || color.border === '#123456' ? 0 :
opts.border === TRUE ? borderWidth(corner, NULL, TRUE) : opts.border;

// Calculate coordinates
coords = calculateTip(mimic, width , height);

// Determine tip size
newSize = calculateSize(corner);
self.size = newSize = calculateSize(corner);
tip.css(newSize);

// Calculate tip translation
Expand Down

0 comments on commit 397be22

Please sign in to comment.