2

以下のコードには 2 つの部分が含まれており、最初の部分は #logo ページのみを処理します

$('#logo').on('click', function() {
// get home info
$.get('ajax.php', {page: 'home'}, function(data) {
    result = $.parseJSON(data);     
    // reset background
    $('#content-area').backstretch(result.background);      
    // reset navigation
    $('.current_page_item_green').removeClass('current_page_item_green');
    $('.current_page_item').removeClass('current_page_item');
    $('.nav-link').each(function() {
        $(this).removeClass('green');
    });     
    // fade out the footer
    $('#footer-row').fadeIn();      
    // reset copy
    $('#subnav').html('');
    $('#home-copy').html(result.copy);

    // reset sizes and colors
    $('#home-logo').animate({height: 200}, 0);
    $('#home-copy').animate({height: 200, backgroundColor: '#004329', color: 'white', paddingTop: 0}, 0);
});});

2 つ目は左側のページを処理し、

$(document).on('click', '.nav-link-ajax', function() { handleAjax($(this));});function handleAjax(eBtn) {
// get the page we want
getPage = eBtn.attr('href');        
// make AJAX call
$.get('ajax.php', {page: getPage}, function(data) {
    result = $.parseJSON(data);     
    // fill in new page
    $('#subnav').html(result.subnav);
    $('#home-copy').html(result.copy);

    // get document height and get rid of 15% minus the height of the boxes and padding
    docHeight = [$(document).height()-($(document).height()*.15)]-200;

    // change height of content boxes
    $('#home-logo').animate({height: docHeight}, 0);
    $('#home-copy').animate({height: docHeight, backgroundColor: 'white', color: 'gray', paddingTop: 0}, 0);

    // fade out the footer
    $('#footer-row').fadeOut();

    // change background
    $('#content-area').backstretch(result.background);

    // clear old nav
    $('.current_page_item_green').removeClass('current_page_item_green');
    $('.current_page_item').removeClass('current_page_item');

    // update navigation
    if (result.nav_color == 'green') {
        // add green
        $('.nav-link').each(function() {
            $(this).addClass('green');
        });
        $(result.current_page_item).addClass('current_page_item_green');
    } else {
        $('.nav-link').each(function() {
            $(this).removeClass('green');
        });
        $(result.current_page_item).addClass('current_page_item');
    }
});}

私の質問は、他の Web ページをクリックしてからロゴ ページに戻ると、下部に余分なスペースがあり、右側にロゴ ページの背景サイズが以前にアクセスした Web ページの背景に従うように見えるということです。

この問題を解決するにはどうすればよいですか? ありがとうございました

4

1 に答える 1