データグリッド - 画像ホバリングイベント

この例では画像ホバリング機能のonBeforeHover と onAfterHoverイベントをキャプチャする方法をお見せします。これらのイベントをキャプチャするには、onAfterInitの関数に以下のイベントシェルを置く必要があります。

    myGrid.onBeforeHover = function(athis){
        // Do something here
    }

    myGrid.onAfterHover = function(athis){
        // Do something here
    }

入力引数は内部画像オブジェクトのオブジェクト参照です。この引数は画像やカレントのグリッド行に関する様々な情報を取り出すために使用されます。

この例では、onBeforeHoverイベントでホバリングした画像に関する情報を取得します。取得した情報は <IMG id="mypreview"> に適用されます。.

    myGrid.onBeforeHover = function(athis){
        var imgcontainer = document.getElementById('mypreview');
        imgcontainer.src = athis.aContent;
        imgcontainer.width = athis.parent.picWidth;
        imgcontainer.height = athis.parent.picHeight;
    }

onAfterHover では、<IMG id="mypreview">のソースに空の画像を割り当てます。.

    myGrid.onAfterHover = function(athis){
        var imgcontainer = document.getElementById('mypreview');
        imgcontainer.src = 'blank.png';
    }

Note: イベントonBeforeHover と onAfterHover は、画像プレビュー機能が無効になっていてもトリガされます。 (myGrid.enablePicturePreview(false);)