21 Mayıs 2015 Perşembe

jQuery Ui Modal Kullanımı

HTML
<a href="#" class="btnc">Tıkla</a>
<div id="tmpExample" title="deneme">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus quam maxime nostrum voluptatem eveniet! Dolor repellat tenetur esse harum suscipit culpa sint ducimus assumenda eum perferendis, illo at molestiae ipsa, odio ea impedit sit. Dolorum in, laudantium tenetur fugiat atque repellat enim, sequi adipisci libero provident aliquid non ullam quidem.</p>
</div>



CSS
    .ui-widget-overlay {
        background: #000;£
        opacity: 0.9;
    }
JS
    $(function() {
                   $('.btnc').click(function(){   })
                $('div#tmpExample').dialog({
                      modal: true,
                      overlay : {
                        background: 'red',
                      },
                      autoOpen: false,
                      open: function() {
                        $('.ui-widget-overlay').bind('click', function() {
                        $('#tmpExample').dialog('close');
                    })
                }
                });
                $(".btnc").click(function() {
                      $("#tmpExample").dialog("open");
                      return false;
                }); 
        });   

Hiç yorum yok:

Yorum Gönder