Use cookies to remember the background color sample code

  • 2020-03-26 23:05:34
  • OfStack

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> 
<html xmlns=""> 
<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script> 
<script src="Scripts/jquery.cookie.js" type="text/javascript"></script> 
<style type="text/css"> 
#p1{ background-color:Red ; width:40px; border:solid 1px yellow ; margin:5px; float:left} 
#p2{background-color:Yellow ;width:40px; border:solid 1px red; margin:5px; float:left} 
#p3{background-color:Blue;width:40px; border:solid 1px yellow; margin:5px; float:left} 
<script type="text/javascript"> 
$(function () { 
if ($.cookie("bgcolor")) { 
$("body").css("background-color", $.cookie("bgcolor")); 

$("p").click(function () { 
$("body").css("background-color", $(this).css("background-color")); 
$.cookie("bgcolor", $("body").css("background-color"), { expires: 7 }); 
<p id="p1"> red </p><p id="p2"> yellow </p><p id="p3"> blue </p> 

Related articles: