関連ページを吹き出し表示する
style.css#daiiz-rel-cards-bubble {
background-color: #fff;
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
position: absolute;
display: none;
padding: 10px;
box-sizing: content-box;
z-index: 10000;
}
.daiiz-cards {
height: 100%;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
}
.daiiz-cards li {
float: none !important;
}
#daiiz-rel-cards-bubble .page-list-item {
display: inline-block;
white-space: normal;
}script.jsvar bindEvents=function(b){var c=null;b.on("mouseenter","a.page-link",function(a){a=$(a.target).closest("a.page-link");if(!a.hasClass("empty-page-link")){var d=$getRelCardBubble(b),f=a[0].getBoundingClientRect();d.css({"max-width":$(".editor-wrapper")[0].offsetWidth-a[0].offsetLeft,left:f.left+window.pageXOffset,top:f.top+window.pageYOffset+a[0].offsetHeight+3-24,"background-color":$("body").css("background-color")});a=a[0].innerText.replace(/^#/gi,"").split("#")[0];a.startsWith("/")?d.hide():($cards=
$getRelCards(a),0===$cards.children().length?d.hide():(d.find(".daiiz-cards").remove(),d.append($cards),d.css({height:$("li.relation-label").css("height")}),c=window.setTimeout(function(){d.show()},650)))}});b.on("mouseleave","a.page-link",function(a){window.clearTimeout(c)});b.on("mouseleave","#daiiz-rel-cards-bubble",function(a){a=$getRelCardBubble(b);window.clearTimeout(c);a.hide()});b.on("click",function(){var a=$getRelCardBubble(b);window.clearTimeout(c);a.hide()})},$getRelCardBubble=function(b){var c=
$("#daiiz-rel-cards-bubble");0===c.length&&(c=$('<div id="daiiz-rel-cards-bubble" class="related-page-list"></div>'),b.find(".page").append(c));return c},$getRelCards=function(b){var c=window.encodeURIComponent(window.location.href.match(/scrapbox.io\/([^\/.]*)/)[1]),a=function(a){if(0===a.find("img.lazy-load-img").length){var b=window.encodeURIComponent(a.find("div.title").text());a.find("div.icon").append('<img src="https://scrapbox.io/api/pages/'+c+"/"+b+'/icon" class="lazy-load-img">')}return a};
$(".daiiz-cards").remove();for(var d=$(".relation-label"),f=$('<div class="daiiz-cards grid"></div>'),g=0;g<d.length;g++){var e=$(d[g]);if(e.find(".title")[0].innerText===b){var e=e.next("li.page-list-item"),h=e.clone(!0);f.append(a(h));for(var k=0;1===e.length&&200>k;)e=e.next("li.page-list-item"),h=e.clone(!0),f.append(a(h)),k++}}return f};$(function(){var b=$("#app-container");bindEvents(b)});