動畫寬度調整大小100％

Question

嗨，我有這個動畫寬度更改器，它似乎自動調整到100％，當我點擊展開此腳本然後單擊我的標題徽標。任何想法爲什麼？

$(".fluid").hide(); 
$(".fixed").click(function() { 
    $("#mainwidth").animate({width: "1024px"}, 800); 
    $(this).hide(); 
    $(".fluid").show(); 
    $.cookie("width","fixed", {expires: 365}); 
    return false; 
}); 
$(".fluid").click(function() { 
    $("#mainwidth").animate({width: "95%"}, 800); 
    $(this).hide(); 
    $(".fixed").show(); 
    $.cookie("width","fluid", {expires: 365}); 
    return false; 
}); 
if($.cookie("width") == "fixed") { 
    $(".fixed").hide(); 
    $(".fluid").show(); 
    $("#mainwidth").css("width","1024px"); 
}; 

text-align: left; 
line-height: 1.4; 
margin: auto auto; 
margin-top: 40px; 
margin-bottom: 50px; 

Answer 1

問題發生在以下塊：

<script type="text/javascript"> 
jQuery(function($) { 
    $(".fluid").hide(); 
    $(".fixed").click(function() { 
     $("#mainwidth").animate({width: "1024px"}, 800); 
     $(this).hide(); 
     $(".fluid").show(); 
     $.cookie("width","fixed", {expires: 365}); 
     return false; 
    }); 
    $(".fluid").click(function() { 
     $("#mainwidth").animate({width: "95%"}, 800); 
     $(this).hide(); 
     $(".fixed").show(); 
     $.cookie("width","fluid", {expires: 365}); 
     return false; 
    }); 
    if($.cookie("width") == "fixed") { 
     $(".fixed").hide(); 
     $(".fluid").show(); 
     $("#mainwidth").css("width","1024px"); 
    }; 
}); 
</script> 

讓我們看看在最後聲明：

if($.cookie("width") == "fixed") { 
    $(".fixed").hide(); 
    $(".fluid").show(); 
    $("#mainwidth").css("width","1024px"); 
}; 

它指示瀏覽器更改寬度頁面加載時。如果width Cookie值爲「固定」，則將寬度設置爲1024px。但是，如果頁面重新加載而Cookie值爲「fluid」？
當您單擊徽標時，它會重新加載頁面。因此，如果cookie值是流暢的，則寬度將不會被設置爲相關值。只需添加另一個代碼塊即可處理cookie值爲「fluid」的情況，並且它可以正常工作。

if($.cookie("width") == "fixed") { 
    $(".fixed").hide(); 
    $(".fluid").show(); 
    $("#mainwidth").css("width","1024px"); 
} 
else if($.cookie("width") == "fluid") { 
    $(".fluid").hide(); 
    $(".fixed").show(); 
    $("#mainwidth").css("width","95%"); 
};