(2011-07の一覧)
01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

2011-07-01 Fri (他の年の同じ日: 2004 2007)

Highslide JSを入れてみた
2011-07-01-1 / カテゴリ: [chalow] / [permlink]

画像をかっこよくみせるjsライブラリ。
Highslide JS - JavaScript thumbnail viewer

参考にしたのは「小粋空間: Highslide JS でサムネイル画像を拡大表示する」で、使ったのは version 4.1.12

テスト


変更点
--- cl.conf	(revision 1856)
+++ cl.conf	(revision 1857)
@@ -157,12 +157,14 @@
 <script type="text/javascript" src="scripts/shBrushPerl.js"></script>
 <script type="text/javascript" src="scripts/shBrushSql.js"></script>
 <script type="text/javascript" src="scripts/shBrushXml.js"></script>
+<script type="text/javascript" src="highslide/highslide.js"></script>
 <link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
 <link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/>
 <script type="text/javascript">
     SyntaxHighlighter.all();
     SyntaxHighlighter.config.tagName = "pre";
     SyntaxHighlighter.defaults['toolbar'] = false;
+    hs.graphicsDir = 'highslide/graphics/';
 </script>
 __HEADER__
 
@@ -641,3 +643,9 @@
     my ($txt, $link) = @_;
     return qq(<a href="$link">$txt</a>);
 }
+
+sub jsimg {
+    my ($img) = @_;
+    (my $thumb = $img)=~ s/(\..+)$/_s$1/;
+    return qq(<a href="$img" class="highslide" onclick="return hs.expand(this)"><img src="$thumb" /></a>);
+}

Changelog内の記述
{{jsimg("img/2011-07-01-1.jpg")}}
指定ファイル名のオリジナルファイルと、拡張し手前に"_s"をつけたサムネ用画像を用意しておく(↑ならimg/2011-07-01-1_s.jpg)

あ、Nexus S(白)が結構安価だったので買っちゃいました！NFC動かしたくて。

てわけで、暇を見つけて写真系はこれ使ってそのうち修正する。
[ コメント ]
前の日 / 次の日 / 最新 / 2011-07

2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12

最終更新時間: 2013-05-02 16:12