Shadowbox - Cách chuyển hoặc thay thế nội dung? Cách đóng và mở một hộp thoại khác?

Tôi đang cố gắng sử dụng shadowbox trong nhiều trường hợp: đôi khi tôi tình cờ cần nhiều hơn một hộp thoại cùng một lúc.Shadowbox - Cách chuyển hoặc thay thế nội dung? Cách đóng và mở một hộp thoại khác?

Trong ví dụ đơn giản này, tôi cố gắng đóng một cửa sổ hiện tại và mở lại một cửa sổ khác nhưng không mở cửa sổ thứ hai. Tôi đang làm gì sai?

<!DOCTYPE HTML> 
<html> 
<head> 
    <link rel="stylesheet" href="shadowbox.css" type="text/css"> 
    <style type="text/css" media="screen"> 
     #sb-body, #sb-loading { background:#eee; } 
    </style> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script> 
    <script src="shadowbox.js" type="text/javascript" charset="utf-8"></script> 

    <script type="text/javascript"> 

     Shadowbox.init(); 

     window.onload = function(){ 

      Shadowbox.open({ 
       content: 'First window. <a id="open-second" href="http://www.google.com">open another window</a>.', 
       player: "html" 
      }); 

      $('#open-second').live('click', function(e){ 
       e.preventDefault(); 

       Shadowbox.close(); 
       Shadowbox.open({ 
        content: 'Second window.', 
        player: "html" 
       }); 
      }); 
     }; 
    </script> 
</head> 
<body>blabla.</body> 
</html>

Kính trọng,
Adit

Nguồn

2011-11-08 Adit Saxena

Xin lỗi 'bout này, nhưng tôi nghĩ rằng tôi sẽ di chuyển về phía hộp thuốc vẽ như nó có vẻ xa ổn định hơn:

$('#second-btn').live('click', function(e){ 
    e.preventDefault(); 
    $.colorbox({ 
    onComplete: function(){ 
     $('#cboxLoadedContent').append('second opened'); 
     $('#cboxClose').attr('id', 'cboxClose_disabled'); 
    }, 
    html:'<p>Second <a id="first-btn" href="x">first</a></p>', 
    width: 500, height: 200 
    }); 
}); 

function showfirst(){ 
    $.colorbox({ 
    onLoad: function(){ $('#cboxClose_disabled').attr('id', 'cboxClose'); }, 
    onComplete: function(){ $('#cboxLoadedContent').append('first opened') }, 
    html:'<p>First <a id="second-btn" href="x">second</a></p>', 
    width: 500, height: 200 
    }); 
} 

$('#first-btn').live('click', function(e){ 
    e.preventDefault(); 
    showfirst() 
}); 

showfirst();

Này, tôi nói chuyện một mình ?! XD

Nguồn

2011-11-10 21:51:53

Tôi đã gặp vấn đề tương tự như bạn, hay đúng hơn, tôi đã cố gắng để có được một hộp đổ bóng để mở hoặc làm mới với nội dung mới khi liên kết nội bộ được nhấn. Tôi lấy lời khuyên của bạn và chuyển sang Colorbox. Làm việc và làm những gì tôi muốn. Cảm ơn :) –

Đây là những gì tôi sẽ sử dụng; không hài lòng với điều này là:
- Tôi đang buộc plugin được sử dụng rộng rãi thực hiện một tác vụ đơn giản (đóng cửa sổ và mở một tác vụ khác)
- nó cần ghi đè lên từng tính năng bóng đổ (hiện chỉ có trình phát "html" được triển khai).

Đây là full working example.

var shadowbox_orig_open = Shadowbox.open; 
Shadowbox.reOpenable = function(new_opts) { 
    if(Shadowbox.isOpen()){ 
     // close other dialog 
     Shadowbox.options.onClose(Shadowbox.getCurrent()); 

     if(new_opts.player == "html"){ 
      $('#sb-player').fadeOut('normal', function(){ $(this).html(new_opts.content).fadeIn(); }); 
     }else{ 
      // ??? 
     } 

     // set other new hooks 
     Shadowbox.options = new_opts.options; 
    }else{ 
     shadowbox_orig_open(new_opts); 
    } 
};

Nguồn

2011-11-09 14:55:10

Shadowbox - Cách chuyển hoặc thay thế nội dung? Cách đóng và mở một hộp thoại khác?

Trả lời

Các vấn đề liên quan