2

そこで、http: //lab.simurai.com/buttons/から取得したこれらの CSS3 ボタンを使用しようとしています。

ここに私が作成したボタンがあります: http://utvecklingspunkten.se/glist/admin/addGuests/button.php

タイトルが示すように、クリックしたときにボタン機能が常に起動するとは限りません。クリックを登録していないように見えるスポット/ピクセルがいくつかあります (これらのスイート スポットをクリックするとボタンの外観が変化するため、これは奇妙ですが、onClick 関数を起動していません)。

ボタンを生成するために使用するコードは次のとおりです。

<div style="margin-left:500px; margin-top:100px;">
    <a href='#' class='button gray glossy' data-icon='✎' onClick='clickHandler()' />
Try clicking this button</a>
</div>

そして単純な JavaScript:

var timesClicked = 0;

function clickHandler() {
    console.log("I've been clicked " + timesClicked + "times.");
    ++timesClicked;
}

登録されていないように見えるスポット (スポットが見つかった高さではなく) は、ボタン内のテキストのベースラインの数ピクセル下にあります。コンソールを上げた状態で、テキストのすぐ下を数回クリックしてみて (クリックがコンソールに記録されます)、その場所が見つかったら注意してください。スイート スポットを見つけるのはそれほど難しくなく、ボタンの特定の高さでクリックしても登録されないため、ボタンが役に立たなくなります。

誰かが理由を知っていますか？

4

1 に答える 1

0

マウスをクリックした場所にポインタをドラッグすると問題が発生するので、onclickイベントごとに変更することでこれを回避できますonmousedown。

于 2012-06-27T08:23:04.887 に答える