Difference between revisions of "User:Wookipan/Sandbox/Page.js"
< User:Wookipan | Sandbox
m (Change selectors in accordance with elements) |
(Add comments with brief explanations, add "hasLink" function to handle tooltips with links on handheld devices) |
||
Line 2: | Line 2: | ||
init: function() { | init: function() { | ||
var $tooltips = $('.wiki-tooltip .wiki-tooltip-content'); | var $tooltips = $('.wiki-tooltip .wiki-tooltip-content'); | ||
− | + | ||
if ($tooltips[0]) { | if ($tooltips[0]) { | ||
− | $tooltips.each(function() { | + | $tooltips.each(function () { |
var $this = $(this); | var $this = $(this); | ||
− | + | ||
+ | // Prevent tooltips from overflowing the viewport | ||
edgeRect = $this.width() + $this.offset().left; | edgeRect = $this.width() + $this.offset().left; | ||
widthRect = $(window).width(); | widthRect = $(window).width(); | ||
Line 12: | Line 13: | ||
$this.css('left', ''); | $this.css('left', ''); | ||
$this.css('right', '10px'); | $this.css('right', '10px'); | ||
+ | } | ||
+ | |||
+ | // Check for links and handle them on handheld devices | ||
+ | if ($this.closest('a').attr('href') !== undefined) { | ||
+ | $this.closest('a').removeAttr('title'); | ||
+ | |||
+ | if (widthRect <= 820) { | ||
+ | wikiTooltip.hasLink($this); | ||
+ | } | ||
} | } | ||
}); | }); | ||
} | } | ||
+ | }, | ||
+ | hasLink: function(tooltip) { | ||
+ | var $a = $('<a>'); | ||
+ | var url = tooltip.closest('a'); | ||
+ | var href = url.attr('href'); | ||
+ | |||
+ | $a.attr('href', href); | ||
+ | url.attr('href', 'javascript:void(0);'); | ||
+ | tooltip.append($a); | ||
+ | tooltip.css('pointer-events', 'auto'); | ||
} | } | ||
}; | }; | ||
$(wikiTooltip.init); | $(wikiTooltip.init); |
Revision as of 23:13, 3 September 2023
var wikiTooltip = { init: function() { var $tooltips = $('.wiki-tooltip .wiki-tooltip-content'); if ($tooltips[0]) { $tooltips.each(function () { var $this = $(this); // Prevent tooltips from overflowing the viewport edgeRect = $this.width() + $this.offset().left; widthRect = $(window).width(); if (edgeRect - widthRect > $this.width()*0) { $this.css('left', ''); $this.css('right', '10px'); } // Check for links and handle them on handheld devices if ($this.closest('a').attr('href') !== undefined) { $this.closest('a').removeAttr('title'); if (widthRect <= 820) { wikiTooltip.hasLink($this); } } }); } }, hasLink: function(tooltip) { var $a = $('<a>'); var url = tooltip.closest('a'); var href = url.attr('href'); $a.attr('href', href); url.attr('href', 'javascript:void(0);'); tooltip.append($a); tooltip.css('pointer-events', 'auto'); } }; $(wikiTooltip.init);