by ihok
2022-08-03 [2022/08/03 21:05:39]
imgまたはimg[data-src]の入った要素で、横400px高さ700pxを超える画像を見開きで読むためのブックマークレットです。エンターで見開き送り。 [ で1ページ送り。 ] で見開き戻し。 \ で消します。開始時は片開きです。両開きにしたいときは途中にあるコメントのhtml(count,++count)を使ってください。最小の縦横画像サイズを変更したいときは、変数の _width と _height の値を変更してください。
/*
* @title 漫画を読むためのブックマークレット
* @description imgまたはimg[data-src]の入った要素で、横400px高さ700pxを超える画像を見開きで読むためのブックマークレットです。エンターで見開き送り。 [ で1ページ送り。 ] で見開き戻し。 \ で消します。開始時は片開きです。両開きにしたいときは途中にあるコメントのhtml(count,++count)を使ってください。最小の縦横画像サイズを変更したいときは、変数の _width と _height の値を変更してください。
*/
var dataSrc=[];
var count=0,_width=400,_height=700;
(function() {
'use strict';
document.querySelector("body").insertAdjacentHTML('beforebegin',`<div class="_manga"></div>`);
document.querySelectorAll("img,img[data-src]").forEach((e,i)=>{
if(_width<e.width&&_height<e.height){
if(e.dataset.src){
dataSrc.push(e.dataset.src);
}else{
dataSrc.push(e.src)
}
}
});
})();
var html =(p1,p2)=>{
document.querySelector("._manga").innerHTML = `
<div style=min-width: 100%;background: black;min-height: 100vh;">
<img src="${p1}" style="position: fixed;top: 0;left: 50%;z-index: 100000;max-height: 100%;" />
<img src="${p2}" style="position: fixed;top: 0;right: 50%;z-index: 100000;max-height: 100%;" />
</div>
`;
};
html("",dataSrc[count]);
/*html(dataSrc[count],dataSrc[++count]);*/
document.addEventListener('keypress', keypress_ivent);
function keypress_ivent(e) {
if(e.code === 'Enter'){
if(document.querySelector("._manga").innerHTML==""){
}else{
count=count+2;
}
html(dataSrc[count],dataSrc[count+1]);
}
if(e.code === 'BracketRight'){
if(document.querySelector("._manga").innerHTML==""){
count=count-1;
}else{
count=count+1;
}
html(dataSrc[count],dataSrc[count+1]);
}
if(e.code === 'Backslash'){
if(document.querySelector("._manga").innerHTML==""){
}else{
count=count-2;
}
html(dataSrc[count],dataSrc[count+1]);
}
if(e.code === 'IntlYen'){
document.querySelector("._manga").remove();
count=0;
}
return false;
}