Featherlight.jsにイベントを設定

Featherlight.jsで、イベントを指定できるようなので試してみました。
(Featherlight.jsについては以前書いたエントリーにでも -> Featherlight.jsでhtmlを読み込んでみる。)

開く前(.beforeOpen)

$.featherlight.defaults.beforeOpen = function(){
    console.log('今から開くよ');
}

開いた後(.afterOpen)

$.featherlight.defaults.afterOpen= function(){
    console.log('開いたよ');
}

閉じる前(.beforeClose)

$.featherlight.defaults.beforeClose= function(){
    console.log('今から閉じるよ');
}

閉じた後(.afterClose)

$.featherlight.defaults.afterClose= function(){
    console.log('閉じたよ');
}

特定のリンクに対するイベント

<a href="/test.html" data-featherlight="ajax" id="test_link">test</a>
$('#test_link').featherlight({
    afterClose: function(){
        console.log('閉じたよ');
    }
});

Ajax時の開く前イベントタイミングはhtmlの読み込みが終わって、lightbox風な動作を行う前のようですね。
読み込む前に何かをしたい時は、更に前に自分でイベントを追加しないと行けないかも。

返信を残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください