ユーザーが配色とテキストサイズを変更できるWebサイトを作成しています。私はクッキーを使用しているので、ページを変更すると、選択した配色/テキスト サイズが記憶されます。
問題は、Web サイトが配色とフォントの両方を同時に正しく「記憶」していないことです。
どちらか一方を使用するだけでも問題なく動作します。たとえば、配色を選択すると、各ページで選択した配色が記憶されます。
ただし、配色を変更してフォントのサイズを変更しようとすると、Web サイトは選択した配色の記憶を停止し、デフォルトの配色に戻ります (ただし、テキスト サイズは記憶しています)。
1つではなく2つのCookieを設定しているためだと推測していますが、1つを設定しようとするとコードが機能しません。
<link class="changeme" rel="stylesheet" type="text/css" href="default.css" title="Standard" />
<link rel="stylesheet" type="text/css" href="twitter/jquery.jtweetsanywhere-1.3.1.css" />
<!-- Loading Javascript -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" language="javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" src="twitter/jquery.jtweetsanywhere-1.3.1.js"></script>
<script> if($.cookie("css")) {
$("link.changeme").attr("href",$.cookie("css"));
}
$(document).ready(function() {
$("#nav li a").click(function() {
$("link.changeme").attr("href",$(this).attr('rel'));
$.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
</script>
<script>
if($.cookie("css2")) {
$("link.changeme").attr("href",$.cookie("css2"));
}
$(document).ready(function() {
$("#resize li a").click(function() {
$("link.changeme").attr("href",$(this).attr('rel'));
$.cookie("css2",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
</script>
スタイルシートの変更
<div id="colourscheme">
<ul id="nav">
<li><a class="colourtext">Colour Scheme: </a></li>
<li><a class="default" href="#" rel="default.css">Default</a></li>
<li><a class="wandb" href="#" rel="alternative.css">White and Black</a></li>
</ul>
<!-- Adjust font size -->
<div id="textadjustment">
<ul id="resize">
<li><a class="textsize">Resize Text: </a></li>
<li><a class="small" href="#" rel="default.css">A</a></li>
<li><a class="medium" href="#" rel="large.css">A</a></li>
<li><a class="large" href="#" rel="largest.css">A</a></li>
</ul>
</div>
私はまだこれを学んでいるので、答えが簡単な場合は申し訳ありません!