카테고리 없음 우측메뉴 숨기기 cookie 버전 interdigm 2016. 6. 28. 06:02 우측메뉴 숨기기 cookie 버전 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="Content-Type" content="text/html; charset=euc-kr"> <title>Untitled Document</title> <!-- 여기서부터는 그대로 복사해서 붙이면됨 수정하지말것 --> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script> <script> /*! * jQuery Cookie Plugin v1.3.1 * https://github.com/carhartl/jquery-cookie * * Copyright 2013 Klaus Hartl * Released under the MIT license */ (function(a,b,c){function e(a){return a}function f(a){return g(decodeURIComponent(a.replace(d," ")))}function g(a){return 0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\")),a}function h(a){return i.json?JSON.parse(a):a}var d=/\+/g,i=a.cookie=function(d,g,j){if(g!==c){if(j=a.extend({},i.defaults,j),null===g&&(j.expires=-1),"number"==typeof j.expires){var k=j.expires,l=j.expires=new Date;l.setDate(l.getDate()+k)}return g=i.json?JSON.stringify(g):g+"",b.cookie=[encodeURIComponent(d),"=",i.raw?g:encodeURIComponent(g),j.expires?"; expires="+j.expires.toUTCString():"",j.path?"; path="+j.path:"",j.domain?"; domain="+j.domain:"",j.secure?"; secure":""].join("")}for(var m=i.raw?e:f,n=b.cookie.split("; "),o=d?null:{},p=0,q=n.length;q>p;p++){var r=n[p].split("="),s=m(r.shift()),t=m(r.join("="));if(d&&d===s){o=h(t);break}d||(o[s]=h(t))}return o};i.defaults={},a.removeCookie=function(b,c){return null!==a.cookie(b)?(a.cookie(b,null,c),!0):!1}})(jQuery,document); </script> <script> $(document).ready(function () { // setup the initial display on page load var menu_state = $.cookie('welcome'); if( (typeof menu_state !== "undefined") && (menu_state == "hidden")) { $('#welcome_block').css("visibility", "hidden"); $('#welcome_show').css("visibility", "visible"); // visible, and cookie is set } else { $('#welcome_show').css("visibility", "hidden"); $('#welcome_block').css("visibility", "visible"); // hidden or cookie is not set, set just in case } $('.disabled').click(function() { $('#welcome_block').css("visibility", "hidden"); $('#welcome_show').css("visibility", "visible"); $.removeCookie('welcome'); // prevent multiple instances $.cookie('welcome', 'hidden'); // update (or set) the cookie $(".disabled").css("display", "none"); $(".enabled").css("display", "block"); //console.log( $.cookie('welcome') ); }); $('.enabled').click(function() { $('#welcome_block').css("visibility", "visible"); $('#welcome_show').css("visibility", "hidden"); $.removeCookie('welcome'); // prevent multiple instances $.cookie('welcome', 'visible'); // update (or set) the cookie $(".disabled").css("display", "block"); $(".enabled").css("display", "none"); //console.log( $.cookie('welcome') ); }); }); </script> <!-- 여기까지 그대로 복사해서 붙이면됨 수정하지말것 --> <style> html, body { margin: 0px; padding: 0px; border: 0px; } #welcome_show, #welcome_block { top: 100px; position:fixed; height: 500px; right:0px; background:orange; z-index:999; } #B { width:100%; background:green; } #d { top:0px; width:990px; background-color:#FFFFCC; margin:0 auto; } </style> </head> <body> <div id="welcome_block"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td height="25px"><a class="disabled" style="cursor:pointer">열기</a></td> </tr> <tr> <td height="25px"><img src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2012/11/08icon.jpg" width="40"></td> </tr> </table> </div> <div id="welcome_show"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td height="25px"><a class="enabled" style="cursor:pointer">닫기</a></td> </tr> <tr> <td height="25px"><img src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2012/11/08icon.jpg" width="20"> 링크연결1</td> </tr> </table> </div> </div> <div id="B"> <div id="d"> <p>본문 컨덴츠</p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </div> </div> </body> </html>