/    Sign up×
Community /Pin to ProfileBookmark

JAvascript with cookies help!!!

Copy linkTweet thisAlerts:
May 18.2007

[B]Hello…

I have this problem with Cookies and Drop Down BG Select

When ever I select a background image, it works…

But if I exit it… The image I selected will not automatically appear…

Why doesnt the cookies work?

Things:

I tried it with IE 7 or Mozila 2.03
I did not make this script
This purpose is for offline use…
Its javascript

Here is the Script[/B]

[QUOTE]

<html>
<head>

<script type=”text/javascript”>
function chkcookie(){
var grabcookies = document.cookie;
var pos = grabcookies.indexOf(“mthbkg=”);
if (pos !=-1){
var st= pos+7;
var en= grabcookies.indexOf(“;”,st);
if (en ==-1) en = grabcookies.length;
var val = grabcookies.substring(st,en);
document.body.style.background=”scroll url(mthImage/”+val+”.jpg)”;
}else{
document.body.style.background=”scroll url(1.jpg)”;
document.cookie = “mthbkg=Apr”
}
}
function chg_bkg(x){
if (x==”1″){document.body.style.background=”scroll url(1.jpg)”;}
if (x==”2″){document.body.style.background=”scroll url(2.jpg)”;}
if (x==”3″){document.body.style.background=”scroll url(3.jpg)”;}
if (x==”4″){document.body.style.background=”scroll url(4.jpg)”;}
if (x==”5″){document.body.style.background=”scroll url(5.jpg)”;}
if (x==”6″){document.body.style.background=”scroll url(6.jpg)”;}
if (x==”7″){document.body.style.background=”scroll url(7.jpg)”;}
if (x==”8″){document.body.style.background=”scroll url(8.jpg)”;}
if (x==”9″){document.body.style.background=”scroll url(9.jpg)”;}
if (x==”10″){document.body.style.background=”scroll url(10.jpg)”;}
if (x==”11″){document.body.style.background=”scroll url(11.jpg)”;}
if (x==”12″){document.body.style.background=”scroll url(12.jpg)”;}
if (x==”13″){document.body.style.background=”scroll url(13.jpg)”;}
if (x==”14″){document.body.style.background=”scroll url(14.jpg)”;}
if (x==”15″){document.body.style.background=”scroll url(15.jpg)”;}
if (x==”16″){document.body.style.background=”scroll url(16.png)”;}
if (x==”17″){document.body.style.background=”scroll url(17.jpg)”;}
if (x==”18″){document.body.style.background=”scroll url(18.jpg)”;}
if (x==”19″){document.body.style.background=”scroll url(19.jpg)”;}
if (x==”20″){document.body.style.background=”scroll url(20.jpg)”;}
if (x==”21″){document.body.style.background=”scroll url(21.jpg)”;}
if (x==”22″){document.body.style.background=”scroll url(22.jpg)”;}
if (x==”23″){document.body.style.background=”scroll url(23.jpg)”;}
if (x==”24″){document.body.style.background=”scroll url(24.jpg)”;}
document.cookie = “mthbkg=”+x;
}
</script>

<body onLoad=”chkcookie()” >
<select name=”mth” onclick=”chg_bkg(value)”>
<option value=”1″>Reborn</option>
<option value=”2″>Apocally</option>
<option value=”3″>The Discovered</option>
<option value=”4″>Join the army</option>
<option value=”5″>Aurostile</option>
<option value=”6″>Bubble Surf</option>
<option value=”7″>World’s End</option>
<option value=”8″>Classical Noting</option>
<option value=”9″>Earth’s Moan</option>
<option value=”10″>Darkest Jungle</option>
<option value=”11″>Sparked Darkness</option>
<option value=”12″>Tree Spark</option>
<option value=”13″>Bottomless Pit</option>
<option value=”14″>Homers got ya</option>
<option value=”15″>DNA String</option>
<option value=”16″>Earth’s End</option>
<option value=”17″>Blue Blossoms</option>
<option value=”18″>African Shine</option>
<option value=”19″>Green Nightmare</option>
<option value=”20″>Atomic Sun</option>
<option value=”21″>Blue Elevator</option>
<option value=”22″>Music’s Boom</option>
<option value=”23″>War Of The Worlds</option>
<option value=”24″>Unsuspected Doom</option>
</select>
</body>

[/QUOTE]

NOTE: That script is with some other scripts

to post a comment
JavaScript

1 Comments(s) ↴

Copy linkTweet thisAlerts:
@toicontienMay 18.2007 — You need to write the cookie value back to document.cookie correctly. It doesn't appear you are. I created a small JavaScript library to handle cookies:
/**
* @class Cookies
* Easy management of document cookies. Also contains a function to test
* if cookies are enabled. The read, delete and write functions are taken
* from Quirksmode.org (http://www.quirksmode.org/js/cookies.html).
* Basically I just made it object oriented, and slightly rearranged it
* to suit my programming preferences. :)
*/
var Cookies = {
/**
* @class Cookies
*
* @function enabled
* Checks to see if the browser has cookies enabled.
*
* @param void
*
* @return boolean
* True if cookies are enabled, false otherwise.
*/
enabled: function() {
return navigator.cookieEnabled ? true : false;
},


/**
* @class Cookies
*
* @function delete
* Deletes the given cookie.
*
* @param name (string, required)
* The name of the cookie to delete.
*
* @return void
*/
delete: function(name) {
this.write(name, "", -1);
},


/**
* @class Cookies
*
* @function read
* Reads the cookie value and returns it.
*
* @param name (string, required)
* The name of the cookie to read.
*
* @return string
* The string value of the cookie.
*/
read: function(name) {
var nameEQ = name + "=", ca = document.cookie.split(';');
var c = null;
for(var i=0;i &lt; ca.length;i++) {
c = ca[i];
while (c.charAt(0)==' ') {
c = c.substring(1,c.length);
}
if (c.indexOf(nameEQ) == 0) {
return c.substring(nameEQ.length,c.length);
}
}
return null;
},


/**
* @class Cookies
*
* @function write
* Saves a cookie to the document.cookie string.
*
* @param name (string, required)
* The name of the cookie to write.
*
* @param value (variable, required)
* The value to store in the cookie.
*
* @param days (number, optional)
* The number of days the cookie should be stored. If the number of days
* isn't given, the cookie is valid until the end of the browser
* session, when the browser is closed.
*
* @return void
*/
write: function(name, value, days) {
var expires = "";
if (days) {
var date = new Date();
expires = "; expires="+date.toGMTString();
date.setTime(date.getTime()+(days*24*60*60*1000));
} else {
expires = "";
}
document.cookie = name+"="+value+expires+"; path=/";
}
};
It's largely based on the functions written on quirksmode.org and just rearranges it into an object oriented fashion. The basic process for what you want:

  • 1. Read the mthbkg cookie and store its value (var mthbkg = Cookies.read('mthbkg')?


  • 2. Apply that background image to the BODY element.


  • 3. When the SELECT is updated, store the new background image value in the mthbkg cookie.
    • ×

    Success!

    Help @Vicboy spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.18,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...