jquery - FancyBoxv2-ログインボックス

Question

私はすべての例を読んで調べました：-http: //fancyapps.com/fancybox/

ポップアップログインボックスを作成するのに役立つものは何もありません。

ログインボックスの例がある古いバージョンのFancybox1.3.xを確認しましたが、その方法は新しいFancyboxv2では実際には機能しません。

誰かが私を助けることができれば、私は幸せになります。

これまでのところ、私はこのコードを持っていますが、これは半ば機能しています：

$("#top-login-button").click(function() {
        $.fancybox.open({
            href : "#login_form",
            padding : 0,
            onClosed : function() {
                    $("#login_error").hide();
            }
        });
    });

    $("#login_form_ajax").bind("submit", function() {

        if ($("#login_name").val().length < 1 || $("#login_pass").val().length < 1) {
            $("#login_error").show();
            return false;
        }

        $.fancybox.showActivity();

        $.ajax({
            type        : "POST",
            cache   : false,
            url     : "/login.php",
            data        : $(this).serializeArray(),
            success: function(data) {
                $.fancybox(data);
            }
        });

        return false;
    });

Answer 1

v2.xの場合、これは機能します（変更されたオプションをコメントアウトしたことに注意してください）

$(document).ready(function() {
 $("#top-login-button").click(function() {
  $.fancybox({
   href : "#login_form",
   padding : 0,
   // it was onClosed for v1.3.4
   afterClose : function(){
    $("#login_error").hide();
   }
  }); // fancybox
 }); //click

 $("#login_form_ajax").bind("submit", function() {
  if ($("#login_name").val().length < 1 || $("#login_pass").val().length < 1) {
   $("#login_error").show();
   $.fancybox.update(); // it was $.fancybox.resize(); for v1.3.4
   return false;
  }
  $.fancybox.showLoading(); // it was $.fancybox.showActivity(); for v1.3.4
  $.ajax({
   type   : "POST",
   cache  : false,
   url    : "/login.php",
   data   : $(this).serializeArray(),
   success: function(data) {
    $.fancybox(data);
   }
  });
  return false;
 }); // bind
}); // ready

更新（2012年8月10日）：懐疑論者のためのデモを追加しました。

Answer 2

コードでは、に変更する必要がありhref : "#login_form"ますhref : "#login_form_ajax"。