使用js cookie记住重新加载页面时的对象位置

时间:2013-08-08 18:56:39

标签: javascript animation cookies css-position

好。所以下面粘贴的代码是另一个更新。我想要做的是使用cookie来存储一个对象的位置,该对象根据两个按钮(实际是DIV)改变它的位置。

createCookiereadCookie基本上是复制和粘贴的。

checkCookiestoreCookie正在执行我正在寻找的大多数功能(记住Cookie和检查页面加载)。

$(document).ready(function()是使用jquery的位置控制。

<SCRIPT type=text/javascript>
////////////////////////FROM QUIRKSMODE.ORG///////////////////////////////
//equivalent of "setCookie" from w3schools
//time is represented in days*hours*minutes*seconds*milliseconds
function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}
//equivalent of "getCookie" from w3schools
function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var 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;
}
///////////////////////////////////////////////////////////////////////////

///////////////////////////cookie functions////////////////////////////////
var pos=readCookie("position");
//var object = document.getElementById('CWS_flow_001');

function checkCookie()
{   
    var object = document.getElementById('CWS_flow_001');

    if (pos=378)
    {
        object.style.position="absolute";
        object.style.left = 378;
        $("#show_primary_rec_001").fadeIn(500);
        $("#show_secondary_rec_002").fadeOut(500);
    }
    else if (pos=-990)
    {
        object.style.position="absolute";
        object.style.left = -990;
        $("#show_primary_rec_001").fadeOut(500);
        $("#show_secondary_rec_002").fadeIn(500);
    }
}
function storeCookie()
{
    //var pos=readCookie("position");
    createCookie("position",pos,1*24*60*60*1000);
    alert("the cookie is set to " + pos);
}
////////////////////////////////////////////////////////////////////////////

////////////////////////animation of object/////////////////////////////////
$(document).ready(function() {
     $("#show_secondary_rec_002").fadeOut(0);


   $("#show_primary_rec_001").click(function moveLeft () {
     $("#CWS_flow_001").animate({
             left: "-990px"
      }, 500 );
     $("#show_primary_rec_001").fadeOut(500);
     $("#show_secondary_rec_002").fadeIn(500);
     //sets "pos" to -990 and runs storeCookie on click w/ 1 second delay
     pos=-990;
     setTimeout("storeCookie()", 1000);
    });

      $("#show_secondary_rec_002").click(function moveRight () {
        $("#CWS_flow_001").animate({
             left: "378px" 
         }, 500 );
     $("#show_primary_rec_001").fadeIn(500);
     $("#show_secondary_rec_002").fadeOut(500);
     //sets "pos" to 378 and runs storeCookie on click w/ 1 second delay
     pos=378;
     setTimeout("storeCookie()", 1000);
    });

 });
 </SCRIPT>

0 个答案:

没有答案