Element から CSS Selector を取得する
コード getCSSSelector.js /** * Element から CSS Selector を取得する * @author toshi (https://github.com/k08045kk) * @license MIT License |...
canvas を画面サイズに合わせる方法
キャンバス要素を画面全体に表示します。 結論 sample-fit-canvas-screen-size.html <!DOCTYPE html> <html> <head> <meta name="viewport...
ウェブページにアウトラインを表示するブックマークレット
はじめに 文章のアウトラインではないです。DOM要素のアウトラインのレイアウトを表示します。 次の画像のような表示を確認するブックマークレットです。 この表示の何が良いのかといえば、要素の配置が一目瞭然になるところです。不要な要素の発見、意図しない位置に配置された要素の発見などに...
JavaScript 無効限定の CSS を適用する
JavaScript を使用する方法 <html class="nojs"> <head> <script> document.documentElement.classList.replace('nojs...
すべてのページで標準のスクロールバーを表示する
はじめに 様々なウェブページがあります。この頃、モバイル対応やレスポンシブ対応の結果、デスクトップ環境のサイトでもスクロールバーを非表示にするサイトが出始めました。 モバイル環境であれば、スクロールバーを非表示にして表示領域を確保するのは良い方法です。ですが、デスクトップ環境では...
右クリックを禁止・禁止解除する
JavaScriptで右クリックを禁止する ページ全体で右クリックを禁止する window.addEventListener('contextmenu', function(e) { e.preventDefault(); }); //window.onconte...
SyntaxHighlighter.jsからhighlight.jsへ移行しました
はじめに 当ブログでは、ブログ上のソースコードをハイライト表示するライブラリを利用しています。ソースコードには、予約後や文字列、数値など予め予測できる書式が多数存在します。それらを指定の色や書体によりハイライト表示することで、ソースコードを読みやす表示しています。 これまで CD...
Bloggerのコメント欄を標準jsなしで返信可能にする
はじめに Bloggerのコメント欄改善です。標準jsを読み込めば、返信（リプライ）できるようにできます。ですが、できるだけスクリプトを使用したくないため、自作して最小限のスクリプトで済ますようにします。 仕様 コメントをJavaScript無効で表示する...
JavaScript から CSS のルールを管理する
忘却録。 <style> を追加する addLocalStyle.js // CSSを追加する var addLocalStyle = function(text) { var style = document.createElement('style...
Bloggerの関連記事表示を強化する
この記事は、既に最新ではありません。最新の関連記事は、「 Blogger用の関連記事表示機能：FeedRelatedPosts.js 」を使用しています。 「 Bloggerに関連記事を表示する 」の続きです。 「A Simple Related Posts Widget For...
Chrome、Firefoxの拡張機能を判定する
Chrome、Firefoxの拡張機能は、WebExtensionsで共通化しました。ですが、細かい部分が異なるため、コードを共通化する必要があります。拡張機能でブラウザを判定する方法のまとめです。 JavaScript ブラウザ判定 // ブラウザ判定 function isF...
Bloggerに自作のソーシャルボタンを配置する
Blogger標準のソーシャルボタンでは、満足できなかったので自作してみた。 完成したソーシャルボタン Twitter, Google+, Facebook, Pocket, Hatenaのソーシャルボタン 画面サイズにより表示を簡略化 マウスのホバーで透過のアニメーション シェ...
DuckDuckGoを使いやすくする
DuckDuckGoが良いらしいと聞いたので使ってみたけど、使いにくかったので出来る限り使いやすいようにしてみた。 結果 NoScript環境(DuckDuckGoのJavaScript無効) GreasemonkeyからユーザスクリプトでSearch Preview互換対応 G...