演習として、jQuery に頼らずに Javascript で hoverzoom スクリプトを作成しようとしています。このスクリプトは<a>
、ページ上のすべてのリンクを配列に配置href
し、拡張子 を検索しjpg
て hoverzoom 関数を適用します。
私はそれを機能させることに非常に近づいています。<a>
この関数は、ファイル名が jpg で終わるインスタンスでは正常に機能しますが、別の名前で終わるとコードが壊れます。問題のあるコードは次のとおりです。
for (var i = 0; i < aLinks.length; i++) {
aExtensions[i] = aLinks[i].href.split('.').pop();
if (aExtensions[i].toLowerCase() == 'jpg') {
aImages.push(aLinks[i]);
}
aImages[i].onmouseover = function() {
hoverZoom(this);
}
aImages[i].onmouseout = function() {
refresh(this);
}
}
完全なスクリプトとライブ バージョンはこちら: http://james.is.agoodman.com.au/git/js_hoverZoom/
ライブ デモでわかるように、2 つの画像リンクで機能し、3 番目の非画像リンクで壊れ、その後の画像リンクも機能しません。
編集: 申し訳ありませんが、質問を指定するのを忘れていました。ソース拡張子が .jpg に一致する場合にのみ機能し、拡張子が一致しない場合は何もしないようにスクリプトを変更するにはどうすればよいですか?