SQLの窓

2016年04月12日


イラストAC用、一括タグ転送ブックマークレット



イラストACでついこないだ仕様変更があって、クリップボードから転送できるようになりました。なので、特に必要無いですが、実装のサンプルとしては localStorage に1セット保存しておいて 転送用ブックマークレットで繰り返し使えるツールです。( 定型部分を登録しておいて使用するという使い方もあります )

クリップボードから転送する場合は、以下の区切り文字が使えます
( タブが無いので Excel 使え無いです )
, : カンマ
; : セミコロン
  : スペース
、: 読点
 : 漢字スペース

ブックマークレットのイラストACタグ保存で使える区切り文字は以下のようになります
カンマ
空白
改行
タブ


※ 保存エリアは一箇所なので、同様のタグを繰り返し使用する場合に保存します

※ 新規(タイトルを入力する前に転送して下さい)・修正ともに使えます( 修正は全て上書き )
タブ入力を実現しているのは、jQuery-tagEditor です。入力された内容は、隠されたテキストエリア内にカンマで繋げて格納されます。

▼ オリジナルデモページ
A powerful and lightweight tag editor plugin for jQuery.

※ js と css だけで実装できます。




posted by lightbox at 2016-04-12 20:30 | Comment(0) | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2015年06月19日


選択した文字列を Google 翻訳で翻訳するブックマークレット( 選択が無い場合はページごと翻訳 )

選択した文字列を新しいウインドウに Google 翻訳を開いて翻訳完了状態にします。選択が無い場合は、同じく Google 翻訳でページ全体を翻訳します。


▼ 訳してみました
Open the Google translated the selected string to a new window and the translation is complete state. If the selection is not, it will translate the entire page in the same Google translation.
ブックマークレットに関する記事


posted by lightbox at 2015-06-19 00:55 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2015年06月18日


jQuery でページを 斜めにして影を付けて 紹介画像として使うブックマークレット

以下のように、ただそのままキャプチャするより良く見えるかもしれません


上のリンクをクリックして、メッセージボックスの OK ボタンをクリックすると、このページを斜めにします。

斜めになっても、WEBページである事にはかわりは無いので、テキスト選択もできますし、リンクも生きています。

ブックマークレットに関する記事
関連する記事


posted by lightbox at 2015-06-18 23:56 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

jQuery でページを 50% に縮小するブックマークレット



縮小だけならば、ブラウザの縮小で対応できますが(ブラウザの場合、元に戻すのが少し面倒)、今後いろいろ対処できるように作成しました。

※ 元に戻すのはリロードです
ブックマークレットに関する記事
関連する記事

▼ ブックマークレットから呼び出している js ファイルの内容
str="";
str+="<"+"script> \n";
str+="if ( window.addEventListener ) { \n";
str+="	window[window.location.hostname+'.loadjQuery'] = '//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js'; \n";
str+="} \n";
str+="else { \n";
str+="	window[window.location.hostname+'.loadjQuery'] = '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js'; \n";
str+="} \n";
str+="document.write(\"<\"+\"script src=\\\"\" + window[window.location.hostname+'.loadjQuery'] + \"\\\"></\"+\"script>\"); \n";
str+="</"+"script> \n";
document.write(str);
function scale_start() {
	$(parent.document.body).css({ transformOrigin: '50% 0' });
	$({scale: 1}).animate(
		{scale: 0.5},
		{
			duration: 1000,
			easing: "swing",
			step: function(now) {
				$(parent.document.body).css({
					transform: 'scale(' + now + ')'
				});
			}
		}
	);
}
str="";
str+="<"+"script> \n";
str+="scale_start(); \n";
str+="</"+"script> \n";
document.write(str);
document.close();

※ transformOrigin を実行しておかないと、ページの中央に向かって縮小されてしまいます( デフォルトが 50% 50% なので )


posted by lightbox at 2015-06-18 23:45 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

ブックマークレット : Googleのドメイン内検索を任意のページで実行

ブックマークレットの登録は、ブックマークバーを表示して、その上にドラッグ・ドロップするのが簡単です。


ドメイン内検索

便利な「切り替え機能」

切り替えボタンで、深い階層へ移動して、その階層にあるページのみ検索できるようになります。アプリケーションの「オンラインマニュアル」の内容検索に絶大な効果を発揮します

表示しているドメインを検索するフォームを埋め込みます
※ 切り替えで、階層を変更可能です



インストールは、ブックマークバー等へ入れるだけですし、アンインストールは削除するだけです。

注意 : 実行本体は、lightbox.on.coocan.jp にありますので、nifty のラクーカンが落ちていると動きません。( https ページへのアクセスには、さくらサーバーを使用しています )

ブックマークレットに関する記事


posted by lightbox at 2015-06-18 23:28 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2015年03月01日


JavaScript : ページのリンクのターゲットを全て name_window という名前に変更して、リンクを開く先を全て同じウィンドウにしてしまうブックマークレット

 
他人のページのリンクをお借りしていろいろ調査したい場合に利用するといいと思います。( JavaScript でページを開いている場合は対象外です )

ページのリンクを全て一つのウィンドウに表示


<a href="javascript:void((function(){var%20obj=document.getElementsByTagName('A');var%20i,len=obj.length;for(i=0;i<len;i++){obj[i].setAttribute('target','name_window');}})());"
onclick='
	alert("ブックマークバーにドロップか、IEでは右クリックでお気に入りに登録(お気に入りバー)が簡単です"); 
	if (window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) { 
		event.returnValue = false; 
	} 
	event.preventDefault(); 
	event.stopPropagation();
'
>ページのリンクを全て一つのウィンドウに表示</a>

 



posted by lightbox at 2015-03-01 10:06 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2015年01月04日


ブラウザ上で選択した文字列で Google 検索するブックマークレット

ブラウザ上で選択した後、なにか処理をするという結構オーソドックスで応用範囲の広いコードです。
選択 → Google検索

<a class="google_search" href="javascript:(function(){var%20b=((window.getSelection&&window.getSelection())||(document.getSelection&&document.getSelection())||(document.selection&&document.selection.createRange&&document.selection.createRange().text));if(b!=''){window.open('https://www.google.co.jp/#q='+encodeURIComponent(b));}else{alert('検索対象文字列が選択されていません');}})();">選択→Google検索</a>

▼ JavaScript部分を整形したもの
(function() {
    var b = ((window.getSelection && window.getSelection()) || (document.getSelection && document.getSelection()) || (document.selection && document.selection.createRange && document.selection.createRange().text));
    if (b != '') {
        window.open('https://www.google.co.jp/#q=' + encodeURIComponent(b));
    } else {
        alert('検索対象文字列が選択されていません');
    }
})();

変数 b にブラウザ上で選択した文字列が入ります。他のサービスで、QueryString に文字列を渡して使う事が可能なページに関しては、このコードの URL 部分とパラメータ部分を変更するだけでそのまま使用できます。

ブックマークレットの一般的な作り方

ブックマークレットのインストール用のアンカーは、href の先頭に javascript: を書いて、その後から一行にした JavaScript のコードをセットしますが、スペースが必要な場合は %20 に置き換えておきます。( 通常変数定義の var の後に使います )

単純なコードだけだと、実行後に画面が壊れるので、コードの最後は void(0) を実行する事が多いです( この場合は、open と alert が最後にあるので必要ありません。)

JavaScript では、|| で結果を返す処理を並べて行くと、最初から順に処理が実行されて、いずれかが true とみなされる結果が返ると処理をそこで中断します。このような特性を使って、最後に規定値を書くような処理は一般的です。
var a,b; a || b || 100
100
var a,b=10; a || b || 100
10


posted by lightbox at 2015-01-04 17:19 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年11月19日


JavaScript : ブックマークレット雛型を使ったサンプル( そのページを1回転させる )


ページを1回転させる

jQuery を使っているので、ブックマークレットが呼び出す外部 JavaScript のソース内で jQuery を組み込んでいますが、既に組み込まれている場合は jQuery で回転させるだけです。 

IE は IE9 以上で回転します
if (!window.lightbox_f) {
	(function() {
		window.lightbox_f = 
		{
			// プロパティ
			version: 1.01
			,
			// メソッド
			init : function( ) {
				/* ここに処理を書きます */
				if ( !window.jQuery ) {
					s = document.createElement("script");
					s.src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js";
					if(s.addEventListener) {
						s.addEventListener("load",callback,false);
					} 
					else if(s.readyState) {
						s.onreadystatechange = callback;
					}
					document.body.appendChild(s);
				}
				else {
					callback();
				}
				function callback() { 
					$({kakudo: 0}).animate(
						{kakudo: 360},
						{
							duration: 3000,
							easing: "swing",
							step: function(now) {
								$(parent.document.body).css({
									transform: 'rotate(' + now + 'deg)'
								});
							}
						}
					);
				}
			}
		};
	})();
}

関連する Microsoft ドキュメント

script 要素とイベントの実行


posted by lightbox at 2014-11-19 17:50 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年11月04日


JavaScript : 通常の WEB ページにブックマークレットでアプリケーション用の IFRAME を埋め込むコード (2) / ページ表示部中央に固定

▼ 本文中のブックマークレット(URLからリンクを作成)の登録用リンク
埋め込みアプリ用 IFRAME

前回は、IFRAME を埋め込んだだけでしたが、今回はIFRAME の中に、HTML を書き込みます。

但し、ブックマークレットで書ける量には限界があるので、SCRIPT 要素と他の若干の処理のみ書きこんで、内部の処理や画面は SCRIPT 要素のsrc 属性で呼び出される.js ファイル内で実行させます。

この方法のメリットは、IFRAME 内で独立した CSS や 変数が使える事と、IFRAME 内から元のページにアクセス可能であるということです。この方法を使えば、ドメイン間のセキュリティの問題は発生しません。
( src に別ドメインを使うとセキュリティの制限でアクセスはできません )

例えば以下のような HTMLとJavaScript を IFRAME の中に埋め込みたい場合、少し特殊な処理が必要になります
<meta charset="utf-8">
<style>
body{
	background-color:#ccc;
}
textarea {
	width:300px;
	height:70px;
}
</style>
<input type="button" value="ダウンロードリンク作成" onclick="build_link();">
<br>
<textarea id="url"></textarea>
<br>
<a id="link" href="#"></a>
<script>
function build_link() {
	document.getElementById("link").innerText = "ダウンロードリンク";
	document.getElementById("link").href= document.getElementById("url").value;
}
</script>
JavaScript 内で画面を作成するには、HTML そのものを文字列として作成して document.write する必要があります。( こちらの javascript ボタンで作成できます )

HTML 部分を文字列化した JavaScript ソースコード(UTF-8)
str="";
str+="<meta charset=\"utf-8\"> \n";
str+="<style> \n";
str+="body{ \n";
str+="	background-color:#ccc; \n";
str+="} \n";
str+="textarea { \n";
str+="	width:300px; \n";
str+="	height:70px; \n";
str+="} \n";
str+="</style> \n";
str+="<input type=\"button\" value=\"ダウンロードリンク作成\" onclick=\"build_link();\"> \n";
str+="<br> \n";
str+="<textarea id=\"url\"></textarea> \n";
str+="<br> \n";
str+="<a id=\"link\" href=\"#\"> </a> \n";
document.write(str);
document.close();
function build_link() {
	document.getElementById("link").firstChild.nodeValue = "ダウンロードリンク";
	document.getElementById("link").href= document.getElementById("url").value;
}
このコードをWEBに保存して、以下のようにスクリフプトタグごと IFRAME 内に document.write する事によって、一般のページに対する処理を行う画面として IFRAME を埋め込む事ができます。

※ もちろん、サイト側で この手のブックマークレットをブロックする事は可能です
<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='fixed';left=l;top=t;zIndex=z;display=v;marginLeft=(((w/2)*-1)+'px');marginTop=(((h/2)*-1)+'px');borderRadius='8px';}}document.body.appendChild(wnd);window._bI.wnd=wnd;wnd.contentWindow.document.write('<'+'script%20src='http://toolbox.winofsql.jp/build_link.js'%20charset='utf-8'></'+'script>%20');})(400,200,1,'50%','50%',1000,'');}" onclick=" 
		alert('ブックマークバーにドロップか、IEでは右クリックでお気に入りに登録(お気に入りバー)が簡単です'); 
		if (window.navigator.appName.toLowerCase().indexOf('microsoft') > -1) { 
			event.returnValue = false; 
		} 
		event.preventDefault(); 
		event.stopPropagation();
	">埋め込みアプリ用 IFRAME</a>
このブックマークレットは、URL を手早くリンク化して右クリックしてそのファイルをダウンロードする為に使用できます

関連する記事

JavaScript : 通常の WEB ページにブックマークレットでアプリケーション用の IFRAME を埋め込むコード(1)
親(parent) フレームに jQuery が無い場合に jQuery をインストールする。


更新履歴
2011-03-20 : 初回投稿
2013-11-03 : ソースコードを単純に書き換えて、解説を追加。
2014-11-04 : ブックマークレットをページ表示部中央に固定



posted by lightbox at 2014-11-04 21:49 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年03月17日


ページを逆立ちさせるブックマークレット

jQuery の回転アニメーション ではページを回転させるアニメーションが実行できたので、試しに作ってみました。もうちょっと手を入れれば、jQuery の回転も実装できると思いますが・・・ジョークプログラムなんで、これで十分でしょう。

※ 元に戻すのはリロードするか、ブックマークレットの中の角度を変更して実行するといいです。

※ クロスブラウジングするほどの実用性無いので、二種類あります。

ためしに、45度とかやってみたんですが、これを仕事中席外した隙にやられたら、結構洒落にならないです。

▼ 45度のまま、デベロッパーツールで、『おすすめユーザ』を消しています

▼ Google Chrome
ページ逆立ち
▼ IE10 と IE11 と Firefox
ページ逆立ち

関連する記事


posted by lightbox at 2014-03-17 01:42 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年03月06日


アドレスバーに表示した URL を、ダウンロードできるリンクを作成するブックマークレット( 動画等、そのままではダウンロードできない場合にとても有効です )



リンクビルダー

▼ 表示しているページに以下のような IFRAME を埋め込みます


実行すると、現在表示している URL を使って、まずダウンロード用の単純なリンクを作成します( このリンクは右クリックから使うように、通常のクリックではメッセージが表示されて、使用できません )

それ以外に、HTML として以下のようなリンクを作成します。
1) 普通のリンク 
2) 新しくウインドウを開くリンク
3) 画像として
4) IFRAME の内容
5) javascript として
6) css として
一度開いた後も、他の URL を上にテキストエリアに貼り付けて再度作成もできます。 ブックマークレット内では、こちらでホスティングしている js ファイルを使用しており、その内容は以下のようになります
str="";
str+="<meta charset=\"utf-8\"> \n";
str+="<style> \n";
str+="* { \n";
str+="	font-size:14px; \n";
str+="	font-family: Arial, Helvetica, Verdana, \"ヒラギノ角ゴPro W3\", \"Hiragino Kaku Gothic Pro\", Osaka, \"メイリオ\", Meiryo, \"MS Pゴシック\", sans-serif; \n";
str+="} \n";
str+="body{ \n";
str+="	background-color:#ccc; \n";
str+="	padding-left: 11px; \n";
str+="} \n";
str+="</style> \n";
str+="<input type=\"button\" value=\"ダウンロードリンク作成\" onclick=\"build_link();\"> \n";
str+=" <input type=\"button\" value=\"アドレスバー取得\" onclick=\"get_link();\"> \n";
str+="<br> \n";
str+="<textarea id=\"url\" style='width:360px;height:70px;' onclick='this.select();'></textarea> \n";
str+="<div style='height:40px;padding:3px;'> \n";
str+="<a id=\"link\" href=\"#\" onclick=\"";
str+="		alert('右クリックからダウンロードして下さい'); \n";
str+="		if (window.navigator.appName.toLowerCase().indexOf('microsoft') > -1) { \n";
str+="			event.returnValue = false; \n";
str+="		} \n";
str+="		event.preventDefault(); \n";
str+="		event.stopPropagation(); \n";
str+="	\"> </a> </div>\n";
str+="<textarea id=\"data\" style='width:360px;height:410px;'></textarea> \n";
str+="<br><a href=\"http://toolbox.winofsql.jp/tool_html_links.htm\" target=\"_blank\" style='color:navy'>HTMLまたはJSのテストページ</a> \n";
str+="<"+"script type=\"text/javascript\"> \n";
str+="get_link(); \n";
str+="build_link(); \n";
str+="</"+"script> ";
document.write(str);
document.close();
function get_link() {
	document.getElementById("url").value = parent.document.URL;
}
function build_link() {
	if ( document.getElementById("url").value == "" ) {
		alert("URL を入力して下さい");
		document.getElementById("url").focus();
		return;
	}

	var url = document.getElementById("url").value;

	document.getElementById("link").firstChild.nodeValue = "ダウンロードリンク";
	document.getElementById("link").href= url;

	var target = "";

	target+="<a href=\""+ url + "\">リンク</a>\n";
	target+="\n";
	target+="<a href=\""+ url + "\" target=\"_blank\">新しいウインドウリンク</a>\n";
	target+="\n";
	target+="<img src=\""+ url + "\" style=\"border: solid 0px #000000;\">\n";
	target+="\n";
	target+="<iframe src=\"" + url + "\" name=\"myframe\" frameborder=\"1\" scrolling=\"yes\" width=\"600\" height=\"400\"></iframe>\n";
	target+="\n";
	target+="<"+"script type=\"text/javascript\" src=\""+ url + "\"></"+"script> \n";
	target+="\n";
	target+="<link rel=\"stylesheet\" href=\""+ url + "\" type=\"text/css\"> ";
	target+="\n";

	document.getElementById("data").value = target;
}

このコードを、IFRAME 内にダイレクトに書き込んで、画面と処理を作成しています。JavaScript で画面を作成する場合、document.write しか選択肢は無く(DOMで作成するとブラウザの違いを考慮する必要があり、細かい調整も複雑になります)、そのような文字列を手作業で作成するのは大変なので、こちらのツールを使用しています。

▼ HTML や JavaScript のコードを文字列に変換します



posted by lightbox at 2014-03-06 12:57 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年01月10日


Seesaa ブログの『カテゴリ』をソートするブックマークレット

▼ ブックマークバーにドラッグ&ドロップして登録して下さい
Seesaaカテゴリソート

処理そのものは、何年も前から IE 拡張で行っていたので安定しています。厳密には、Seesaa ブログの仕様変更( HTML 部分が変更された場合 )で動かなくなる事はありますが、その場合は以下の JavaScript を変更してどこかにホスティングして読み出せばいいと思います。
var doc = parent.document;
var colTable = doc.getElementsByTagName("TABLE");
var len = colTable.length;
var objTable,colInput,colINum
for( var i = 0; i < len; i++ ) {

	objTable = colTable[i];

	if ( objTable.className == "entrytable" ) {
		colInput = objTable.getElementsByTagName("A");
		colINum = objTable.getElementsByTagName("INPUT");
	}

}

len = colInput.length;
len = len / 2;
var cname1 = Array();
var cname2 = Array();
for( var i = 0; i < len; i++ ) {
	cname1.push((colInput[i*2].firstChild.nodeValue).toUpperCase());
	cname2.push((colInput[i*2].firstChild.nodeValue).toUpperCase());
}

cname2.sort();

len = cname2.length;
var base_i;
for( var i = 0; i < len; i++ ) {
	base_i = cname1.indexOf(cname2[i]);
	colINum[base_i].value = (i*10)+100;
}

この内容は、http://winofsql.jp/seesaa_cat_sort.js として現在ホスティングしています。ブックマークレツトからは、ページに IFRAME を作成して、このスクリプトを読み込ませて、seesaa_cat_sort.js は、parent の document を操作して目的を果たしています。 
<a href='javascript:if(window[window.location.hostname+".loadSeesaaCatSort"]!==true){window[window.location.hostname+".loadSeesaaCatSort"]=true;(function(){var%20wnd=document.createElement("iframe");with%20(wnd){with%20(style){display="none";}}document.body.appendChild(wnd);wnd.contentWindow.document.write("<"+"script src=\"http://winofsql.jp/seesaa_cat_sort.js\"></"+"script>");wnd.contentWindow.document.close();})();}void(0);'>Seesaaカテゴリソート</a>
▼ 元の状態
if ( window[window.location.hostname+".loadSeesaaCatSort"] !== true ) {
	window[window.location.hostname+".loadSeesaaCatSort"] = true;
	(function() {
		var wnd = document.createElement("iframe");
		with (wnd){
			with (style){
				display = "none";
			}
		}
		document.body.appendChild(wnd);
		wnd.contentWindow.document.write("<"+"script src=\"http://winofsql.jp/seesaa_cat_sort.js\"></"+"script>");
		wnd.contentWindow.document.close();
	})();
}

関連する記事

Google ドライブに HTML を置いて WEBページが作れるようになりました



posted by lightbox at 2014-01-10 13:10 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2014年01月09日


Picasa のギャラリーを日付の新しい順にソートするブックマークレット

機能的に、お気に入りバー(ブックマークバー) に登録するのが使いやすいです

ブラウザから Picasa を使っておられる方には解ると思うのですが、新規に画像をアップロードすると、最後に追加される上に、ソートするにはアクションが多すぎて面倒です。

そこで、これでメニューから自動的に全てのアクションを実行します。対象となるギャラリーを開いた状態で実行して下さい。

※ Google はページ内の仕様が良く変わるので突然使え無くなる可能性があります。

▼ ブックマークレットです。右クリックから登録します。
( Google Chrome は、ブークマークバーにドラッグドロップ )
IE 以外はバー表示しておいて、ドラッグドロップ(IE11 ではお気に入りに追加でバーへ登録)
Picasa新しい順
ブックマークレットからは、window.open でウインドウを開いて、スクリプトを書きこんでいるだけです。二つのページにまたがる処理なので、このような手法をとっていますので、何かの問題でそのウインドウが開いたままになる可能性はありますので、その場合は手動で閉じて下さい( 小さなウインドウです )

実行している処理そのものは、いたってシンプルです。ほとんど Picasa のページ内のオブジェクトの値やメソッドを使用しているので特別な処理は作る必要がなかったというのが実際のところです。
var url = opener.document.URL + "";

var re = new RegExp("\.com\/([^\/]+\)/","g");
re.exec(url);

opener.location = 'https://picasaweb.google.com/lh/reorder?uname='+RegExp.$1+'&aid='+opener._album.id;
setTimeout("sortdata();",1000);

function sortdata() {
	try {
		opener.document.getElementById("lhid_sortmenu").value = 'date_new_to_old';
		opener._d('sortSlides', opener.document.getElementById("lhid_sortmenu"));
		opener._d('reorder', opener._album.link );
		window.close();
	}
	catch(e) {
		setTimeout("sortdata();",1000);
	}
}




posted by lightbox at 2014-01-09 21:48 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2013年12月17日


選択文字列を mixiボイスの投稿画面に遷移させるブックマークレット

mixi の SimplePost を使って、mixi ボイスを投稿します。このブックマークレットでは、投稿文字列を任意の WEB ページで選択してから画面遷移を行います( mixi へのログイン状態が必要ですが、ログインされていない場合はログインする画面に遷移します )
ブックマークレット => mixiボイス

javascript:var%20d=document,w=window,enc=encodeURIComponent,e=w.getSelection,k=d.getSelection,x=d.selection,s=(e?e():(k)?k():(x?x.createRange().text:0)),s2=((s.toString()=='')?s:(enc(s))),f='https://mixi.jp/simplepost/voice',l=d.location,p='?status='+s2,u=f+p;try{if(!/^(.*.)?tumblrzzz[^.]*$/.test(l.host))throw(0);tstbklt();}catch(z){a =function(){if(!w.open(u))l.href=u;};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();}void(0)
関連する記事

選択文字列を Twitter の投稿画面に遷移させるブックマークレットの内容の解説

mixi の SimplePost API を使って、HTML(JavaScript)のみで初期値を設定して mixi のサービス画面へ誘導する

YouTube の『watch?v=動画ID』のページで実行すると、Shadowbox 用貼り付けコード取得ページに移動するブックマークレット

Panoramo の Photo ページで使用すると貼り付けコードを取得できるページへジャンプするブックマークレット



posted by lightbox at 2013-12-17 22:55 | ブックマークレット | このブログの読者になる | 更新情報をチェックする

2013年12月13日


選択文字列を Twitter の投稿画面に遷移させるブックマークレットの内容の解説

選択文字列を Twitter の投稿画面に遷移させるブックマークレット
ブックマークレット => 選択文字でTwitter投稿


このブックマークレットは、殆ど var の変数定義によってなりたっていて、通常の JavaScript に整形すると以下のような単純なものとなります。
var d=document;
var w=window;
var enc=encodeURIComponent;
var e=w.getSelection;
var k=d.getSelection;
var x=d.selection;
var s=(e?e():(k)?k():(x?x.createRange().text:0));
var s2=((s.toString()=='')?s:(enc(s)));
var f='https://twitter.com/intent/tweet';
var l=d.location;
var p='?text='+s2+'&url='+enc(w.location),u=f+p;
try{
   if(!/^(.*.)?tumblrzzz[^.]*$/.test(l.host))throw(0);
   tstbklt();
}
catch(z){
   a=function(){
      if(!w.open(u))l.href=u;
   };
   if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);
   else a();
}

この内容からも解りますが、元々は tumblr関連(?) の為に作られたものを転用しています。実際はこの部分を削除してもっと短くなるのですが、元々の発祥を残すためにそのまま使っています。( ライセンス等の詳細は不明です )

変更する部分は、9行目と11行目で、9行目は遷移するページで、11行目はそのページへの QueryString となります。

選択した内容は、クロスブラウジングされていて、この方法ですと、IE11 でも問題無く動作します。選択した文字列は、通常 encodeURIComponent によって UTF-8 でエンコーディングして使用します。この場合ですと、そのページの URL もエンコーディングしています。

最後に、windows.open で開くようになっていますが、Firefox の場合はタイマーで遅延で使用し、それ以外はすぐ実行しています。

13行目と14行目は必要無い部分ですが、13行目でエラーとなり(throw される)、window.open が起動されるようになっているので、tumblrzzz という部分を変更して特定のドメインにすると、表示されているページと一致した場合に、『tstbklt』という function が本当に存在するとその function が呼ばれるようになっています。( 特定のページで任意の function をコールする事が可能になります )


posted by lightbox at 2013-12-13 21:18 | ブックマークレット | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します


Windows
container 終わり

フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

Android SDK ポケットリファレンス
改訂版 Webデザイナーのための jQuery入門
今すぐ使えるかんたん ホームページ HTML&CSS入門
CSS ドロップシャドウの参考デモ
Google Hosted Libraries
cdnjs
BUTTONS (CSS でボタン)
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり