よく使う汎用jQuery：：ホバーボタン

test.html

<img src="/img/off/hoge.gif">
<!-- 下記ボタンは動作しない -->
<img src="/img/off/hage.gif" class="not_hover">

common.js

    //  /img/off/と/img/on/にある同一ファイル名の画像を切り替える
    $("img:not(.not_hover), input[type='image']:not(.not_hover)")
        .on('mouseenter touchstart', function() {
            $(this).attr("src", $(this).attr("src").replace('/off/', '/on/'));
        })
        .on('mouseleave touchend', function() {
            $(this).attr("src", $(this).attr("src").replace('/on/', '/off/'));
        })
    ;
    //  CSS対応
    $(".bg-hover:not(.not_hover)")
        .on('mouseenter touchstart', function() {
            $(this).css("background-image", $(this).css("background-image").replace('/off/', '/on/'));
        })
        .on('mouseleave touchend', function() {
            $(this).css("background-image", $(this).css("background-image").replace('/on/', '/off/'));
        })
    ;

画像はファイル名を同じにしてonフォルダとoffフォルダへ。
動作させたくない場合はclass="not_hover"
何となくずっと使ってるけど、セレクタをclass指定にした方が軽いかも。