▼ ブックマークレット登録用のリンク IFRAME ※ Google Chrome は、ブックマークバーにドラッグ&ドロップ ※ Firefox は、ブックマークツールバーにドラッグ&ドロップ ※ IE は、右クリックでお気に入りバーへ登録 これだけでは、役には立ちませんが、次にこの IFRAME の中に画面(または処理のみ)を構築します _bI は、ユニークであれはなんでもいいのですが、bindIframe を略しています。リロードしない限り、いったん作成した IFRAME を window._bI.wnd で参照する事ができます。w : 幅 h : 高さ b : ポーダー( 0:なし、1:あり ) l : 左表示開始位置 t : 上表示開始位置 z : zIndex v : 表示する : ""、表示しない : "none"
<script> if (!window['_bI']) { window._bI = {}; (function(w, h, b, l, t, z, v) { var wnd = document.createElement('iframe'); with (wnd){ frameBorder = b; width = w; height = h; with (style){ position = 'absolute'; left = l; top = t; zIndex = z; display = v } } document.body.appendChild(wnd); window._bI.wnd = wnd; wnd.contentWindow.document.write('<style>body{background-color:#ccc;}</style> '); wnd.contentWindow.document.close(); })(400, 200, 1, '0px', '0px', 1000, ''); } </script>
ブックマークレット登録用のコードは以下のようになります ※ 変数定義と空白出力にのみ、%20 を使いますが、それ以外のスペースは全て取り除いています ※ ブックマークレットは、A 要素 の中で記述するので、< と > は、< と > に変更します。
<a href="javascript:if(!window['_bI']){window._bI={};(function(w,h,b,l,t,z,v){var%20wnd=document.createElement('iframe');with(wnd){frameBorder=b;width=w;height=h;with(style){position='absolute';left=l;top=t;zIndex=z;display=v}}document.body.appendChild(wnd);window._bI.wnd=wnd;wnd.contentWindow.document.write('<style>body{background-color:#ccc;}</style>%20');wnd.contentWindow.document.close();})(400,200,1,'0px','0px',1000,'');}">IFRAME</a>
リンク(アンカー)の表示文字列が登録時の文字列になりますが、登録後に各ブラウザで変更する事ができます。 カスタマイズは、400,200,1,'0px','0px',1000,'' の部分を変更します 関連する記事 JavaScript : 通常の WEB ページにブックマークレットでアプリケーション用の IFRAME を埋め込むコード (2) / ページ表示部中央に固定 親(parent) フレームに jQuery が無い場合に jQuery をインストールする。 変更履歴 2011-03-20 : 初回投稿 2013-10-31 : 内容の再整備
|
【ブックマークレットコードの最新記事】