カテゴリー別アーカイブ: Javascript

jQueryを使ったリサイズエンドイベント(メモ)


リサイズイベントはデフォルトのものがあっても、
リサイズエンドイベントはないですよね。

リサイズするたびに実行すると重くなるような関数のときは、
リサイズエンドのときだけ実行したい場合がある。
そんなときに使えそうな手法です。

▼リサイズエンドイベント

$(function() {
	var obj = {
		resizeTimer:0,
		resizeCheck:function(){
			// もし実行前のタイマーがあったらクリア(0.5秒以内にチェックが来たらリサイズエンドしていないと判断してリサイズエンドイベントをキャンセル)
			if (obj.resizeTimer){
				clearTimeout(obj.resizeTimer);
			}
			// リサイズエンドイベントを作成する
			// 0.5秒間、次のチェックが来なかったらリサイズエンドとみなしてobj.resizeEndを実行する
			obj.resizeTimer = setTimeout(obj.resizeEnd, 500);
		}
	};
	// リサイズエンドイベント
	obj.resizeEnd = function(){
		//ここにリサイズエンドの処理を書く
	}
	// 通常のリサイズイベント
	$(window).on('resize', function (e) {
		obj.resizeCheck(); // リサイズのたびにチェック関数の飛ばす
	});
});

このサンプルの場合、0.5秒間リサイズされなかったら、
リサイズエンドとみなします。

ツイートボタンがないページで簡易ツイートリンクを自動生成するブックマークレット


これだけソーシャルが普及しても、いまだにソーシャルボタンがないページが五万とあります。

ワンボタンでリツイートすることに慣れてしまうと、
ページタイトルとURLをコピーして投稿することですら、わずらわしくなります。

そんなときに下記のリンク先にあるブックマークレットを使うと、
リツイートボタンと同等のリンクをページ右上に自動生成してくれて便利です。

ブックマークレットのページ

<ブックマークレットの使い方>
①まず、下記のようにブックマークツールバーにドラッグしていつでもクリックできるようにします。

②次にツイートリンクを生成したいページを表示して、このボタンをクリックします。
すると、右上に新しいリンクが自動生成されるはずです。

ときどき失敗するかもしれませんが、
使えたら使ってみてください。

ツイッター投稿用に横書きテキストを縦書き”風”にするJSを作ってみた。


最近、ツイッターで改行が有効になったようなので、
横書きテキストを縦書き風にするJSを作ってみた。

CSS3やJavaScriptを駆使した縦書きではなく、
あくまで擬似的に見た目上のみ縦書きに見えるよう変換します。

用途は、縦書きで和風に見せたい。変わった感じに見せたい。
日本語が通じる人だけが読めればよくて、検索では拾えないようにしたい。(暗号もどき)など。

▼デモページ
横書きテキストを縦書き風にするJSページ
※ページをダウンロードしてローカルで使用しても構いません。
※文字の全角変換はkanaxsという便利な変換モジュールを少し改変したJSを使っています。

▼投稿イメージ
投稿イメージ