Проблемы с динамическим контентом в jquery Booklet (buildbywill)

Question

У меня проблемы в несколько раз. Во-первых, в данный момент это работает только в Firefox. Chrome даже не выдает ошибку и не выдает предупреждение «после». Во-вторых, и это главная проблема, код ниже работает в определенной степени; он доходит до первого вызова «после», но я думаю, что мне нужно как-то обновить буклет, чтобы понять, что там есть новые элементы div.

По сути, я спрашиваю, может ли кто-нибудь сказать мне, почему он не работает в Chrome и есть ли способ обновить буклет, чтобы он понял, что есть два новых элемента div?

Если вам нужно больше кода от меня, пожалуйста, дайте мне знать.

Заранее спасибо

Код запроса

$(function() {
    $('#booklet').booklet({
        height: 600,
        width: 960,
        manual: false,
        pageNumbers: false,
        pagePadding: 0,
        after: function(opts){
            var btn = $('#next-page').attr('className');
            //alert(btn);
            $.get('../../ajax/getAjaxBrand/'+btn, function(data) {
                alert(data);
                $('#next-page').replaceWith(data);
            });
        }
    });
});

Возвращенный HTML

<div id="pager">    
    <div id="twotap-left">          
        <div class="twotap-image" style="background: url(http://localhost:8888/turner/catalogue/images/brand/single-page/) no-repeat;">         
            <img src="http://localhost:8888/turner/catalogue//images/fade-left.png" />      
        </div>      
        <div class="twotap-stuff">          
            <div class="twotap-title">
                <h1 id="twotaph1" class="typeface-js" style="font-family:TradeGothic;font-weight:bold;">HOLLYWOOD JUSTICE</h1>
            </div>          
            <div class="twotap-details">
                <h3 id="dps-det" class="typeface-js" style="font-family:TradeGothic;font-weight:bold;">6 x 30MINUTE EPISODES</h3>
            </div>          
            <div class="twotap-copy">
                <p>Hollywood Justice takes an in-depth look at Hollywood's famously challenged. Each episode delves into the lives, details and history of Hollywood celebrities who’ve had brushes with the law. The show profiles the stars who've gone from fame to infamy, and sometimes back again, with a focus on their antics both in and out of the courtroom.</p>           
            </div>          
            <div class="twotap-clogo">
                <img src=http://localhost:8888/turner/catalogue/images/logos/tru.png height='49px' />           
            </div>      
        </div>  
    </div>
</div>
<div id="pager">    
    <div id="two-tap-pf">       
        <img src="http://localhost:8888/turner/catalogue//images/fold-tra.png" />   
    </div>  
    <div id="twotap-right">     
        <div class="twotap-image" style="background: url(http://localhost:8888/turner/catalogue/images/brand/single-page/TRU-hot-purs.jpg) no-repeat;">         
            <div id="twotap-turner">
                <img src="<?php echo base_url();?>/images/turner-small-b.png" />
            </div>      
        </div>          
        <div class="twotap-stuff">              
            <div class="twotap-title">
                <h1 id="twotaph1" class="typeface-js" style="font-family:TradeGothic;font-weight:bold;">HOT PURSUIT</h1>
            </div>
            <div class="twotap-details">
                <h3 id="dps-det" class="typeface-js" style="font-family:TradeGothic;font-weight:bold;">.47 x 30 MINUTE EPISODES</h3>
            </div>              
            <div class="twotap-copy">
                <p>From high-speed chases to dangerous crashes, this adrenaline-pumping series shows the dangers our law enforcement professionals face every day.  Each episode focuses on a different situation – from raging drunks to lawless kids, from female fugitives to the worst escape attempts of all time, this series shows cops confronting all the most intense and hilarious challenges the country’s highways have to offer.  Featuring the most amazing footage ever captured, much of it taken from dashboard-mounted cameras in the police vehicles themselves, each half-hour episode is a wild ride.</p>             
            </div>
            <div class="twotap-clogo">
                <img src=http://localhost:8888/turner/catalogue/images/logos/tru.png height='49px' />
            </div>          
        </div>  
    </div>
</div>
<div id="next-page" class="house_of_clues">
</div>

Answer 1

Это должно работать на основе того, что я использую (отлично работает кросс-браузер):

$('.book').booklet({
    autoCenter: true,
    covers: true,
    manual: false,
    pageNumbers: false,
    pagePadding: 0,
    width: 840,
    height: 570,
    closed: true,
    overlays: false,
    prev: $('.nav a.prev'),
    next: $('.nav a.next')
});

Кажется, что мой буклет работает - не пробовал с обратным вызовом для before() или after(), но я тоже хочу знать об обновлении буклета, чтобы можно было добавлять динамическое содержимое AJAX ...