TopJavaScriptブックマークレット > 2013年10月
2013年10月 8日

スマホ向けページを拡大できるようにするブックマークレット

October 8,2013 1:55 AM
Tag:[, , ]
Permalink

スマホ向けページを拡大できるようにするブックマークレットを作ってみました。

1.概要

最近、PC向けのページとスマホサイト向けのページで最適化しているウェブサイトが増えてきました。

そういう場合、大抵のスマホサイト向けのページはピンチアウトしても拡大できないようになっています。

具体的には、name属性が「viewport」のmeta要素にあるcontent属性の「user-scalable=no」で抑止しています。

<meta name="viewport" content="width=device-width, user-scalable=no" />

が、スマホサイトに掲載されている画像や地図が小さい場合が多く、拡大したいときについピンチアウトして、拡大できずにがっかりすることが多いです(拡大しても粗い画像になるだけの気がしますが)。

ということで、このブックマークレットを使えば、拡大できないスマホサイトをピンチアウトで拡大できるようになるかもしれません(すべてのページで拡大できるかどうか保証できません。実験レベルです)。

テストページを作ったので、こちらでお試しください。

テストページ(拡大不可)
テストページ

テストページにブックマークレットを適用して拡大
テストページにブックマークレットを適用して拡大

動作はiPhoneで確認しています。

2.ブックマークレットの使い方

iPhoneで下のページを開いてブックマークしてください。

ページを拡大

ブックマークしたページをブックマークレットとして利用する方法は「iPhoneでブックマークレットを利用する方法」の「続いてURLの編集作業に移ります。」からお読みください。

ページを移って説明を読むのが面倒な人は、ブックマークしたURLから「http://www.koikikukan.com/samples/20131008/index.html?」を削除すればOKです。

あとは拡大したいページを開き、保存したブックマークを選択すれば拡大できるようになるかもしれません。

Comments [0] | Trackbacks [0]
2013年10月 7日

パスワードを表示するブックマークレット

October 7,2013 1:55 AM
Tag:[, , ]
Permalink

入力フォームのパスワードフィールドのパスワードを一発で表示するブックマークレットを作りました。

1.概要

ログイン時の入力パスワードをブラウザなどに記憶させて使っている人は少なくないと思います。

が、別のPCでログインしたり、パスワード変更時に前のパスワードを入力しないといけないときなど、入力していたパスワードをうっかりすっかり忘れてしまうケースもあると思います。

このブックマークレットを使えば、入力しているパスワードの内容を一発で確認することができます。

注:ご利用にあたっては、パスワードを忘れたときのみブラウザのお気に入りに登録し、確認後はすぐに削除するようにしてください。

1.ブックマークレットの使い方

以下のリンクをブックマークして、パスワードを見たいページを保存してブックマークをクリックまたは選択すれば、パスワードが表示されます。

パスワード表示

パスワード入力ページを表示します。

ブックマークレットを起動すれば、パスワードフィールドの文字列を一発で表示します。

2.ソースコード

ブックマークレットのコードを掲載しておきます。

パスワードを表示するブックマークレット(ソースコード)

javascript: (function () {
    var input = document.getElementsByTagName('input');
    for (i=0; i<input.length; i++) {
        if (input[i].type == 'password') {
            input[i].removeAttribute('type');
        }
    }
})();

理屈は簡単で、input要素でtype属性が「password」の場合、type属性を削除しているだけです。

この仕組みは以下の記事を参考にさせていただきました。

WWW WATCH - Chromeなどで保存したパスワードが丸見えだから危険とか言われている件について

type属性を削除したあとでフォームを実行しても正常に処理されるようですが、ブラウザに依存するかもしれません。

Comments [0] | Trackbacks [0]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

AMN
Categories
Monthly Archives
2020年
2019年
2018年
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3