What's wrong with this jQuery? It isn't working as intended
Posted
by
Doug Smith
on Stack Overflow
See other posts from Stack Overflow
or by Doug Smith
Published on 2011-11-14T01:41:51Z
Indexed on
2011/11/14
1:50 UTC
Read the original article
Hit count: 248
jQuery
Using cookies, I want it to remember the colour layout of the page. (So, if they set the gallery one color and the body background another color, it will save that on refresh. But it doesn't seem to be working.
jQuery:
$(document).ready(function() {
if (verifier == 1) {
$('body').css('background', $.cookie('test_cookie'));
}
if (verifier == 2) {
$('#gallery').css('background', $.cookie('test_cookie'));
}
if (verifier == 3) {
$('body').css('background', $.cookie('test_cookie'));
$('#gallery').css('background', $.cookie('test_cookie'));
}
$('#set_cookie').click(function() {
var color = $('#set_cookie').val();
$.cookie('test_cookie', color);
});
$('#set_page').click(function() {
$('body').css('background', $.cookie('test_cookie'));
var verifier = 1;
});
$('#set_gallery').click(function() {
$('#gallery').css('background', $.cookie('test_cookie'));
var verifier = 2;
});
$('#set_both').click(function() {
$('body').css('background', $.cookie('test_cookie'));
$('#gallery').css('background', $.cookie('test_cookie'));
var verifier = 3;
});
});
HTML:
<p>Please select a background color for either the page's background, the gallery's background, or both.</p>
<select id="set_cookie">
<option value="#1d375a" selected="selected">Default</option>
<option value="black">Black</option>
<option value="blue">Blue</option>
<option value="brown">Brown</option>
<option value="darkblue">Dark Blue</option>
<option value="darkgreen">Dark Green</option>
<option value="darkred">Dark Red</option>
<option value="fuchsia">Fuchsia</option>
<option value="green">Green</option>
<option value="grey">Grey</option>
<option value="#d3d3d3">Light Grey</option>
<option value="#32cd32">Lime Green</option>
<option value="#f8b040">Macaroni</option>
<option value="#ff7300">Orange</option>
<option value="pink">Pink</option>
<option value="purple">Purple</option>
<option value="red">Red</option>
<option value="#0fcce0">Turquoise</option>
<option value="white">White</option>
<option value="yellow">Yellow</option>
</select>
<input type="button" id="set_page" value="Page's Background" /><input type="button" id="set_gallery" value="Gallery's Background" /><input type="button" id="set_both" value="Both" />
</div>
</div>
</body>
</html>
Thanks so much for the help, I appreciate it. jsFiddle: http://jsfiddle.net/hL6Ye/
© Stack Overflow or respective owner