javascript

Element.scrollIntoView() with options

「だいたいあの辺に飛べば良いや」というときに便利な scrollIntoView() メソッド。 呼び方は三通り。 element.scrollIntoView(); element.scrollIntoView(alignToTop); // Boolean parameter element.scrollIntoView(scrollIntoViewOptions); // Object par…

ページの途中に表示するメッセージ

.entry-content pre > code.hljs { background-color: #3f3f3f; /* zenburn ... .hljs */ padding: 10px; } .entry-content pre { padding: 0; } tt { font-family: Consolas; } hljs.initHighlightingOnLoad(); .message-by-key { color: green; font-size:…

人力検索と Hatena::Let とアドオンと

.entry-content pre > code.hljs { background-color: #3f3f3f; /* zenburn ... .hljs */ padding: 10px; } .entry-content pre { padding: 0; } tt { font-family: Consolas; } hljs.initHighlightingOnLoad(); まずは、 Hatena::Let のコードがさみしいの…

Google Maps API → OpenLayers API (V3以降)

Google Maps API を OpenLayers API に書き換えるとこうなる、という話です。以前、こんな投稿をしたのですが、OpenLayers のバージョンは V2 です。 そのときは既に V3 が出ていましたし、この記事を書いている時点では、OpenLayers は V5 が出ようか、とい…

Proxy 切り替えアドオン @Firefox 59

Firefox 57 では、PAC を変更することしかできなかった WebExtension API 。 Firefox 59 で、ようやくプロクシの設定を切り替える手段ができた。 https://developer.mozilla.org/en-US/Firefox/Releases/59#WebExtensions https://developer.mozilla.org/en-…

offsetLeft の罠

こちらのさいとう先生の画像を切り取ろうとしたときのこと。 あれ、ずれてる... offsetParent をたどって行けば、良いんじゃなかったっけ (´・ω・`) let e = ... let x = 0, y = 0; do { x += e.offsetLeft; y += e.offsetTop; } while (e = e.offsetParent)…

Promise vs async/await

背景というか、状況というか Firefox の addon で、コンテンツプロセスでスクリプトをロードしたり、コードを実行したりする browser.tabs.executeScript() を続けて実行したい、という場面。 ライブラリを使いたいんだけど、一部がエラーになる ライブラリ…

画像に色をつけて、くりんくりん回す

モノトーンな画像。 これに、javascript で色をつける。 css で、くりんくりん。 .x20170627 { padding: 0.5ex 2em; width: 27px; } .x20170627-table { border: 0 !important; background-color: unset !important; } .x20170627-table td { vertical-align…

ソースを並べて表示する@はてなブログ

この記事の余談。 同じことをやるふたつの方法の比較なので、ソースを並べて表示したかった。 ソース HTML javascript CSS 実は、手こずった もうひとつの仕込み

Google Maps API → OpenLayers API

id:ykhpno1 さんの、この質問。 その前までの一連の質問で、Google Maps API を使ってある程度の形になっていたのだけれど、アクセス数の制限があったりするから OpenStreet Map に変更したいという お話。 Google Maps API のここは、OpenLayers API ではこ…

Template Strings

見た目を作ったりいじったりするような Bookmarklet なんかでは、HTML の要素やスタイルを文字列でたくさん書かなきゃいけないこともママあり。 でも、javascript にはヒアドキュメントがないので、こんな書き方でお茶を濁してた。 /* #qa_chemistry { posit…

HTMLでパスワード制限

やりたかったのは、自分のブログに置いたログインフォームに、それっぽい動きをさせたい、かな。 HTMLでパスワード制限を掛けたいです。ネットで検索してもちゃんとした物はないので質問しました。CGIやMD5などの暗号化や一般では使わないコード内にパスワー…

はてなスクリーンショット拡張 (Firefox) への最後通告

はてなでは、サービスを便利にご利用いただけるツール群を「便利なツール」のページにて提供しておりましたが、現在のご利用状況を鑑み、来たる3月31日をもちましてこちらのページでのツールの提供を終了、一部のツールを廃止することといたしました。 「便…

はてなスクリーンショットへの長く険しい道のり

はてなスクリーンショット拡張がきちんと動かなくなるやつの修正に至るまでの経緯と、その続き。 # 長いよ ここから始まった 重たい Firefox を何とかしたい はてなスクリーンショットが動かない 戦い(その1) まずは検索から アドオンのデバッグ 尻尾は…

fotolife 一括アップロード Bookmarklet の覚書

64bit 版の Firefox では、Fotolife の Flash を使う一括アップロードが動かない。 なので、こんな Bookmarklet を書いてみた。 フォトライフ一括アップロード - Hatena::Letやっつけ感が満載なので、未来のぼくに向けてメモ書きを。 一度に送れる画像は 10…

はてなスクリーンショットで「ファイルに保存」ができない

こんなのを書きました。 修正したコードのテストをしてて思い出したのだけれど、そう言えば「ファイルに保存」が機能しなかったなあ、と。 画面キャプチャするアドオンはいくつかあるけど、直接 フォトライフ にアップロードができるところが、はてなスクリ…

はてなスクリーンショットが Firefox 44 で動かなくなった

結構、便利に使わせてもらってる「はてなスクリーンショット拡張」。 でも、Firefox 44 では動かなくなってしまった。 人力検索でも似たような質問が…… ちょっと前から気になっては いたんだ どうして動かなくなったのか Firefox 44 での修正 はてなスクリー…

はてなスペースが腐海に沈む

はてなスペースが終わっちゃうんだってね はてなスペースを2016年2月29日に終了します 2012年12月20日にサービスを開始し、様々なユーザーの皆さまにご利用いただいていた「はてなスペース」ですが、ご利用状況を鑑み、2016年2月29日をもって提供を終了させ…

question:1450921794

q.hatena.ne.jp 例えば、はてなのidを選択して、質問回数と回答回数を取得して、テキストエリアに入れる場合。 <html lang="ja"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://raw.github.com/padolsey/jQuery-Plugins/master/cross-domain-ajax/jquery.xdomainajax.js"><…</head></html>

dispatch event

別の要素のイベントを発火させるアレ。let.hatelabo.jp アイコン付きのスターに変更する Bookmarklet を手直ししてて、ちょっとはまったので備忘がてら。 DEMO mouseover + mouseout event──→ #o20151222_1, #o20151222_2 { width: 100px; height: 100px; di…

ゆで卵

お湯に入れておく程度のものだろうに、ネット上には「ゆで卵の作り方」がたくさん転がってる。 ゆで卵ごときにネットでやり方を探してるのはどうなんだろう、ということもあるが、最近は、ここのを使ってる。絶対に失敗しないトロトロ半熟ゆで卵の作り方。火…

テキストを検索して、そこにジャンプ

http://q.hatena.ne.jp/1394067786やっつけだけど、こんな感じ。古いIEじゃ動かない。 function moveToText(txt) { // 文字列を見つける var found = window.find(txt); // Range を取得 var sel = getSelection(); var rng = sel.getRangeAt(0); // 目印に…

はてなブログで LightBox ちっくなことを

やってみた \つついて!/ .tbox { position:absolute; display:none; padding:14px 17px; z-index:900; } .tinner { padding:15px; -moz-border-radius:5px; border-radius:5px; background:#fff url(data:image/gif;base64,R0lGODlhMAAjAPYAAP////T09OHh4…

canvas でハートマークを書いてみる

androidの図形描画についての質問です。 CANVASにdrawRectでハート型を描画したいと思っています。 色々検索してみましたが、ハート型のサンプル等がなく困っています。 ハートを描画するコードやサンプルが載っているURL等教えていただけないでしょうか。 …