Ben nasıl olur da yeniden boyut ve yeniden pozisyon belirli bir div öğesi görüntülemek için bir shadowbox / greybox pencere?

1 Cevap php

Ben yeniden boyut ve yeniden pozisyon belirli bir div öğesi görüntülemek için bir greybox veya shadowbox pencere mümkün olup olmadığını bilmek istiyorum?

Ben bir wordpress sitesi için bir şablon oluşturma, ve ben varsayılan takvimi kullanıyorum, ancak takvimin içinde bir tarihte tıkladığınızda, varsayılan eylem, yeni bir pencerede açmak için.

Eğer bir tarihte tıkladığınızda, kutu yerine yeni bir sayfa, içinde içeriğini gösteren takvim üzerinde açılır böyle bir şekilde mod greybox veya Shadowbox mümkün olurdu?

Ya da belki jQuery veya Javascript ile, istenen sonucu elde başka bir yolu var mı?

Herhangi bir yardım büyük ölçüde önceden takdir thanx olurdu!

1 Cevap

jQuery UI sizin sonuç elde edebilirsiniz Dialog adında bir widget. Bu gibi kullanabilirsiniz:

$(document).ready( function() {

    // This will initialize the dialog box and hide it by default.
    // You can find a list of most options here: http://docs.jquery.com/UI/Dialog
    $("#dialog").dialog({
        autoOpen: false,
        modal : true,
    });

    // This will select the links like you specified
    $('#wp-calendar a').click( function(e) {
        e.preventDefault() // Disable the link from going to a new page
        var url = $(this).attr("href"); // Pull the HRef for the link for making the AJAX request

        // This will make an AJAX request and put the result in the dialog.
        $("#dialog").empty().load(url, function() {

            // This is the callback for when the AJAX request finishes
            // All it does it open the dialog, which now has data in it
            $("#dialog").dialog("open");
        });
    });
});

Not: Bunun için jQuery UI kurmanız gerekir, ve muhtemelen Dialog üzerinde okumak isteyeceksiniz here. Eğer bu incelikle aşağılamak isterdim, daha fazla adımlar atması gerekir ve biçimlendirme bağlı olacak. Eğer takvimde bir "gün" bir pasajı sonrası olabilir, ben sizin ihtiyaçlarınıza terzi deneyebilirsiniz.


Edit:; olay için işlenen sayfasına dönmek dosya? "/ Ajax / event.php id = 123" olduğunu, önce (yeni bir sayfa gezinme) bağlantının varsayılan davranışı engellemek isterdim Diyelim o zaman iletişim içine monte edilmiş bir URL veri yüklemek için jQuery yük fonksiyonunu kullanmak isterdim; bu isteği tamamladığında, iletişim kutusunu açmak isterdim. Ben bunu yapmak için kod düzenlenmiş ettik ve JavaScript etkin olmayan kullanıcı için incelikle düşer.