1

イメージマップを使用して、単一の画像でマルチリンクを作成しようとしています。ユーザーがこのスクリプトでリンクにカーソルを合わせたときにイベントを追加したい

$("#gt1").hover(
    function () {
        $(this).append($("<div id='mouse' class='gtcon'><span>Hello 1</span></div>"));
    },
    function () {
        $(this).find("div:last").remove();
    }
);

しかし、機能していません。なにか提案を？ここに私の完全なスクリプトがあります。http://jsfiddle.net/edisutrisno/6t9gL/

4

1 に答える 1

4

今、( ) の<div>中に a を追加しようとしていますが、意味がありません。<area>this

しかし、私はあなたがこれを望んでいると思います:

$("#gt1").hover(
    function () {
        $(document.body).append($("<div id='mouse' class='gtcon'><span>Hello 1</span></div>"));
    },
    function () {
        $("div:last").remove();
    }
);

これにより、おそらく必要なきれいな泡が効果的に作成されます。

デモンストレーション

gvee が気づいたように、繰り返しを減らすことができます。例えば ​​：

var texts = [null,'hello 1', 'hello 2'];
$(".pin").hover(
    function () {
        $(document.body).append($("<div id='mouse' class='gtcon'><span>"+texts[this.id.slice(-1)]+"</span></div>"));
    },
    function () {
        $("#mouse").remove();
    }
);

デモンストレーション

于 2013-09-09T11:49:43.550 に答える