memo.xight.org

日々のメモ

chalowで画像ポップアップ

Summary

クリックしたらサムネイルの画像を拡大するようにした.

大きな画像をポップアップ [2005-09-28-5] のJavaScriptを popupImage.jsというファイルで保存して,各ページに<script>タグを埋め込む.


<script src="popupImage.js" type="text/javascript"></script>


chalowファイルの get_link_str の中を変更

sub get_link_str {
	my ($a, $b) = @_;
	if ($a =~ /\.(jpg|jpeg|png|gif)$/i) { # [[http://nais.to/|image/nais.jpg]]
		# return qq(<a href="$b"><img src="$a" alt="画像" /></a>);
		return qq(<img src="$a" alt="クリックして拡大" onclick="popupImage('$b')" /><a href="$b">.</a>);
	} elsif ($b =~ /\.(jpg|jpeg|png|gif)$/i) { # [[自画像|image/sp.jpg]]
		return qq(<img src="$b" alt="$a" />);
	} else {            # [[トップページ|http://nais.to/]]
		return qq(<a href="$b">$a</a>);
	}
}


Reference

オブジェクト指向JavaScript - 大きな画像をポップアップ
http://web.paulownia.jp/script/sample/popup.html