英語のサイトのご紹介です。
NICE Titles というMacライクなツールチップ(マウスをリンクに合わせると表示されるもの)がありますが、それをじわじわと表示させるためのJSです。
ツールチップで利用しているCSSというかデザインがいまいちなのですが、その点をクリアすればかっこいい視覚効果として利用できるかもしれません。
「Item Hider」というなんだかよくわからないけれども、もしかしたら便利かもしれないBookmarkletです。
ttp://www.xag.org/tech/techBlogs4God/2005/05/26.html
実行すると別ウィンドウがポップアップされ、ページの構成要素がチェックボックスと共に表示されます。チェックボックスをチェックするとその要素が表示/非表示されます。
作成者は印刷時に要らないものを印刷しないようにするときに便利、としています。
なるほど。
この他、逆にコンテンツのナビゲーションのようなメニューとして使ってみるというアイディアもおもしろいかもしれません。つまり、このbookmarkletの逆の動きです。
いろいろとアイディアが沸いてきます。
ページのどこにどのCSSのクラスが割り当てられているかを視覚的に表示してくるbookmarkletを紹介しています。IEでは動作しないようです。
この手のbookmarkletはこのほかにもいろいろあるのですが、その中でも実用的な表示のさせ方をしているのでご紹介してみることにしました。
Bookmarkletを満載にしたWebデザイナー向けのツールバーです。
Windows IE用
Accessibility Toolbar 日本語版 バージョン1.1
http://jun.mods.jp/atb.html
Firefox用
Web Developer Extension(英語です)
http://www.chrispederick.com/work/firefox/webdeveloper/
便利です。お試しください。
先日記事を書いた「リンクをリスト化してフッター表示」ですが、これはIE用だったのでMozilla FirefoxやOperaで使えるものを「ふうこのにこにこぼっくす」さんが作成されました。
リンクをリスト化してフッター表示(for Mozilla Firefox)
先日の記事で「IEだけか・・・」とがっかりされた方は試してみてはいかがでしょうか。
ふうこさん、トラックバックでお知らせいただきありがとうございました。
このBookmarkletを使用すると、ページ内で使用しているリンクを抽出してその一覧をページのフッター部分に番号付きで表示させます。
リストの番号はページで使用しているその場所にも表示されるので、どのハイパーリンクがどこにリンクしているかの対応表のようなものを簡単に作成することができるようになります。
デザイナーさんがクライアントさんと打ち合わせをする際、リンク先の確認などに利用するとものすごく便利でしょう。
試しに「Yahoo Japan」でこのBookmarkletを使用してみてください。すぐにその効果がわかるでしょう。
Internet Explorerでのみ動作します。