高橋メソッドのUserScript
https://gyazo.com/702437cb526ec910486706a3fd361251
デモ
こんな感じに
プレゼンの見出しや
特に伝えたいメッセージを
中央に配置することができる
使い方
=> 自分のページが作成される
下記のコードをcode:script.jsとして自分のページに貼る
import '/api/code/shoya140/高橋メソッドのUserScript/script.js'
詳細
code:script.js
(() => {
function updatePresentationStyle() {
const titles = document.querySelectorAll('.section-title')
Array.from(titles, (title, i) => {
const lines = document.querySelectorAll('.section-' + i)
const sectionText = Array.from(lines, (l) => {return l.innerText}).join('')
if (title.innerText.trim() === sectionText.trim()) {
title.classList.add('centerlized')
}
})
}
const target = document.querySelector('html')
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (target.dataset.displayStyle === 'presentation') {
updatePresentationStyle()
}
})
})
observer.observe(target, {attributes: true, childList: false})
var css = document.createElement('style');
css.type = 'text/css';
css.innerHTML = '.app.presentation .centerlized { top: 50%; transform: translateY(-80%); } .app.presentation .lines { height: 100vh; }';
document.body.appendChild(css)
})()
shoya140.icon