2020-03-14 13:25:55 +01:00
<!DOCTYPE html>
2020-12-08 14:48:22 +01:00
< html lang = "en" >
2020-03-14 13:25:55 +01:00
< head >
< meta charset = "utf-8" / >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< meta name = "description" content = "A JavaScript plugin to add informative item tooltips for Guild Wars 2." / >
< meta name = "keywords" content = "Guild Wars 2 gw2 item tooltip information hover" / >
< meta name = "author" content = "F.W. Dekker" / >
< meta name = "application-name" content = "GW2 item tooltip" / >
<!-- JQuery / Bootstrap -->
2021-09-10 15:47:43 +02:00
< script src = "lib/jquery.min.js" > < / script >
< script src = "lib/bootstrap.min.js" > < / script >
< link rel = "stylesheet" href = "lib/bootstrap.min.css" / >
2020-03-14 13:25:55 +01:00
<!-- Syntax highlighter -->
<!-- http://alexgorbatchev.com/SyntaxHighlighter/ -->
2021-09-10 15:47:43 +02:00
< script type = "text/javascript" src = "lib/shCore.min.js" > < / script >
< script type = "text/javascript" src = "lib/shBrushXml.min.js" > < / script >
< link type = "text/css" rel = "stylesheet" href = "lib/shCoreDefault.min.css" / >
2020-03-14 13:25:55 +01:00
< script type = "text/javascript" > SyntaxHighlighter . all ( ) ; < / script >
<!-- Custom scripts and styling -->
< script src = "js/GW2Tooltip.js" > < / script >
< script src = "js/ItemTooltip.js" > < / script >
< script src = "js/SkillTooltip.js" > < / script >
< link rel = "stylesheet" type = "text/css" href = "css/main.css" / >
2020-12-08 14:48:22 +01:00
< link rel = "stylesheet" type = "text/css" href = "css/GW2Tooltip.css" / >
2020-03-14 13:25:55 +01:00
< title > GW2 Item tooltip< / title >
< / head >
< body >
< nav class = "navbar navbar-inverse navbar-fixed-top" >
< div class = "container" >
< div class = "navbar-header" >
< a class = "navbar-brand" href = "#" > FWDekker< / a >
< / div >
< / div >
< / nav >
< div class = "container" >
< div class = "contents" >
<!-- Breadcrumbs (top) -->
< ol class = "breadcrumb" >
< li class = "active" > Home< / li >
< / ol >
<!-- /Breadcrumbs (top) -->
< div class = "page-header" >
< h1 > Guild Wars 2 Item tooltip< / h1 >
< / div >
< a href = "https://waflix.stackstorage.com/index.php/s/g7S5ESbmJJLAG5w/download" > < span class = "glyphicon glyphicon-download-alt" > < / span > Download< / a > < br / >
< div >
< h2 > About< / h2 >
< p >
< b > Guild Wars 2 item tooltip< / b > is a JavaScript utility to add tooltips for Guild Wars 2 items to display information about them. No frameworks required and simple to use.
< / p >
< / div > < br / >
< div >
< h2 > How it works< / h2 >
< p >
Tooltips can be added in two ways:< br / >
< ul >
< li > by supplying the information to be displayed directly (using < code > ItemTooltip.addDirect< / code > ); or< / li >
< li > by giving the ID of the item (using < code > ItemTooltip.addNow< / code > ).< / li >
< / ul >
With the latter option the < a href = "https://wiki.guildwars2.com/wiki/API:2" > Guild Wars 2 API< / a > is accessed and up-to-date information is retrieved and used to create the tooltip. Note that this option does < i > not< / i > work in Internet Explorer versions 9 and below; it does, however, work on every other major browser.< br / >
For more information you can refer to the < a href = "docs.html" > documentation< / a > .
< / p >
< / div > < br / >
< div >
< h2 > Demo< / h2 >
< h3 > Code< / h3 >
< pre class = "brush: html; toolbar: false;" >
< head>
< !-- Include the script and style -->
< script src="js/ItemTooltip.js">< /script>
< link rel="stylesheet" href="css/ItemTooltip.css" />
< /head>
< body>
< !-- Add the tooltip to an element -->
< a id="demoItemTooltip">This is an item tooltip.< /a>
< script>
GW2Tooltip.addNow(document.getElementById("demoItemTooltip"), 46762, ItemTooltip);
< /script>
< /body>
< / pre >
< h3 > Result< / h3 >
< a id = "demoItemTooltip" > This is an item tooltip.< / a > (it may take a second to appear if you just loaded this page)
< script >
GW2Tooltip.addNow(document.getElementById("demoItemTooltip"), 46762, ItemTooltip);
< / script >
< / div > < br / >
< div >
< h2 > Q& A< / h2 >
< h3 > Q: Does it work with traits/skills/waypoints too?< / h3 >
< p > A: At the moment it works for items only, but I'm planning on adding this functionality later on.< / p >
< h3 > Q: Why don't crafting materials display the required crafting disciplines and their levels?< / h3 >
< p > A: The Guild Wars 2 API does currently not offer a way to retrieve this information, or at least not directly from the item itself.< / p >
< h3 > Q: Does it work with JQuery, Underscore, Backbone, Angular etc.?< / h3 >
< p > A: Yes. It does not require any framework and it should not collide with any framework either.< / p >
< / div > < br / >
<!-- Breadcrumbs (top) -->
< ol class = "breadcrumb" >
< li class = "active" > Home< / li >
< / ol >
<!-- /Breadcrumbs (top) -->
< / div >
< / div >
< / body >
< / html >