jQuery ポップアップ

href使わずにpopup

jsめも
javascript:void(0) は値を何も返さないが、hoverでリンク先表示されるとキモい
これでhref使わずにできる↓
data-target=""は-の後に任意の値、.data('target') で値をとる
（業務においては新しくコーディングルールをつくらないといけないので）
汎用性を考えると、dataを使うのは微妙
状況に応じて使う

html

<p class="table-bottom-text"><a class="popup" href="javascript:void(0)" data-target="#construction-popup">> 詳細をみる</a></p>

js

$(function () {
    $('.popup').click(function(){
        var target = $($(this).data('target'));
        target.fadeIn();
        target.find('.close,.bg').click(function(){
            target.fadeOut();
        });
        //return false;
    });
});

もとのjs、汎用性を考えた実装

js

$(function () {
    $('.popup').click(function(){
        var target = $($(this).attr('href'));
    // これはボタンおして、ﾍﾟｰｼﾞ遷移する前に実行される
        target.fadeIn();
        target.find('.close,.bg').click(function(){
            target.fadeOut();
        });
        return false;
        // これでハッシュつけないようにできる、
        // この後つづけて$('.popup').click(function(){ のイベント設定するとリターンフォルスで実行されない
    });
});