pngfix & rollover library sisso.jsを作成しました。

通販で自転車のスポーク買いました。agoです。

社内から「yuga.jsみたいに呼べば使えて、環境に依存しないpngfixとrolloverライブラリがほしい」とリクエストを受けたので作成してみました。

使い方はファイルをダウンロードし、以下のようにマークアップすれば完了です。

<img src="opacity.png" class="btn" />
<!-- mouseover時にopacity_o.pngを表示 -->

<div class="bgpng" style="background-image:url(opacity.png); width:200px; height:200px"></div>
<!-- 背景のpngfix（img,input[type="button"]は自動的にpngfixする） -->

<div class="bgpng btn" style="background-image:url(opacity.png); width:200px; height:200px"></div>
<!-- 背景のpngfix+mouseover時にopacity_o.pngを表示 -->

<a href="/" class="external">target="_blank"</a>
<!-- linkへtarget="_blank"を設定する -->

<p class="wordBreak" style="width: 50px;border: 1px solid #000;">aaa<em>bbb<span>ccc</span>ddd</em>eee</p>
<!-- 強制改行 -->

また、以下の形式で設定を変更することができます。

読み込み時に指定
<script type="text/javascript"http://svn.coderepos.org/share/lang/javascript/sisso/sisso.js#setting1=value1&setting2=value2"></script>

読み込み時前に指定
<script type="text/javascript">
    if (!Sisso) var Sisso = {};
    Sisso.setting1 = 'value1';
    Sisso.setting2 = 'value2';
</script>
<script type="text/javascript"http://svn.coderepos.org/share/lang/javascript/sisso/sisso.js"></script>

同時に指定に指定した場合、読み込み時前に指定したものが優先されます。
（この場合、setting1=value1、setting2=value2となります）
<script type="text/javascript">
    window.Sisso.setting1 = 'value1';
    window.Sisso.setting2 = 'value2';
</script>
<script type="text/javascript"http://svn.coderepos.org/share/lang/javascript/sisso/sisso.js#setting1=value3&setting2=value4"></script>

指定できる値は以下の通りです。
blankUrl
    1x1の透過gif URL
    初期値
    http://tech.kayac.com/data/iepngfix-library-sisso-js/blank.gif
overClass
    rollover対象のクラス
    初期値
    btn
externalClass
    外部windowで開くリンクの対象クラス
    初期値
    external
wordBreakClass
    wordBreak対象のクラス
    初期値
    wordBreak
pngFixSelector
    pngFix対象selector（IE6が認識できるもののみ）
    初期値
    img, input, .bgpng
pngFixVersion
    pngFixを行うIEのバージョン（IE7もリンクがクリックできなくなる問題があるのでpngFixを行うことを推奨）
    初期値
    6,7
noRoll
    自動的にrolloverを行わない場合true
    初期値
    false
noPngFix
    自動的にpngFixを行わない場合true
    初期値
    false
noExternal
    自動的にexternalを行わない場合true
    初期値
    false
noBreakAll
    自動的にwordBreakを行わない場合true
    初期値
    false
noGMap2Error
    google maps apiと同時に読み込んだ場合、エラーを出さない場合true
    （仕様上google maps apiと同時に読み込むと非常に重くなるので、この値をtrueにする場合pngFixSelectorでgoogle maps領域を除外することを推奨）
    初期値
    false