Friday, April 11, 2014

How to Use Cookies in Javascript alphause

Helplogger Home Blog DesignWidgets SEO Menus Po ... How to Use Cookies in Javascript 3 comments Each time we visit a website, cookies can be stored to 'remember' things that we do while browsing a page. This may happen, for example, when we visit a page where we have to login with an username and a password. In this case, after verifying that the login is correct, usually a cookie is recorded on our computer. An example would be the popular page of Google. This search engine allows users to choose how many search results they want to see on each page. Thanks to a cookie, this configuration remains unchanged for each computer, even after rebooting several sessions. Despite this, it is good to remove them from time to time because, although, some will expire being erased automatically after a while, some of them will never do so. Like many other things, cookies may suffer a poor use and hence their bad reputation. For instance, some websites can store and study the browsing habits of a user without their knowledge. This is why most browsers already include a system to filter them and can decide if they will provide some privacy or not. If you want to see a live example of how a cookie works, please visit this pageand refresh it a few times. You should get an alert window telling you about how many times you visited the page. (script source: javascriptkit.com) There could be other ways to use cookies but a server could do this with JavaScript. Below we have a simple script that can be used as many times we want, even for different purposes. Basically, what the following script does is to create three functions: the first one is to set a cookie, the second one is to read it, and the last one is to erase it. We can apply it in Blogger by accessing the template HTML and add it just before thetag: Once done, in order to set a cookie, we only need to put the name and the value in quotes when we call the function. Additionally, we will set the expiry date by getting the current Time (in milliseconds) and add the required number of minutes (in milliseconds): var expiration = new Date(); expiration.setTime(expiration.getTime() +10000);//Expire after 10 seconds setCookie("cookiename","hello",expiration); }The above code sets a cookie calledcookiename, with thehellovalue and set its expiry date to 10 seconds after it has been set (10000milliseconds = 10 seconds). If we want to restore the value of this cookie, then we should use the second function with the cookie name: var checkCookie = getCookie("cookiename");By adding this code below, we created a cookie with the value 'hello' which can be shown on the screen if we want to. The cookie will disappear after 10 seconds: The erase function is used in the same way as the one for reading just by clicking on the name of the cookie. ThesetCookievalues for 'domain' and 'secure' are not utilized. Use 'domain' on the Javascript cookie if you are using it on a subdomain, where the cookie is set on the widgets subdomain, but you need it to be accessible over the whole yoursite.com domain. The combination of these three functions will allow us to handle cookies for specific purposes, as we will see in the near future. Like 0 Random Posts jQuery Sliding Panel with Expanding/Collapsing Content for Blogger15/02/2014 - 4 Comments Create a CSS3 Image Hover Effect with Animated Vinyl Record31/01/2014 - 5 Comments How to create Google Adsense Account10/03/2012 - 31 Comments Related Posts: How to add custom Variable definiti... Understanding the Page Elements of ... How to Increase Thumbnail Resoluti... How to Use Character Entities in CS... What is the difference between padd... 3 comments: sanjeewa perera 3/10/2014 Hi, this is absolutely perfect blog, great information. Today I found your blog and really glad i did. Can you please do a tutorial about " Floating left menu with automatic scrolling with page".. exactly similar effect, which you've on your blog. I really love it..and very effective for the user. Thanks lot! Reply Replies Admin 3/10/2014 Hi Sanjeewa, I will make a tutorial about this soon. Thanks for visiting! sanjeewa perera 3/12/2014 Thanks lot Admin, I'm really looking forward for this tutorial. ** this floating menu can be additional floating menu, to the main top navigation, so it will always floating at left side of the blog. Thats how I visualized it. :) Thanks! Reply Add comment Comment as: Sign out Notify mePublishPreview Privacy Policy| Disclaimer| Terms of Service| Sitemap Back to Top DMCA PROTECTED Search Search Follow on Facebook Helplogger Like 2,775 people like Helplogger . Facebook social plugin Follow on Blogger Subscribe via Email Receive Quality Tutorials Straight in your Inbox by submitting your Email below. Submit Or subscribe via RSS Feed Recent Posts How to Add Numbered Page Navigation Widget for Blogger 5 Easy Ways to Improve the SEO of a blog & Boost Traffic What is the difference between padding and margins? Add a Custom jQuery Lightbox To Blogger How to Use Cookies in Javascript Recent Comments Joseph V M Hi, I've added pagination to my blog... dara king good Mel Ancheta You did it finally, thanks admin (: sorry for my late reply... Sandra Harriette It never ceases to amaze just how much we can do with Blogger.... Gabor Sziladi One question i still have...how can i keep distance between my... Popular Posts Simple Recent Posts Widget for Blogger/Blogspot Create A Rollover Image Effect (change image on mouseover) Recent Comments Widget For Blogger How to remove Blogger Picture/Image Shadow and Border Hide/Show Widgets /Gadgets in Home/post /static/archive pages in Blogger 0 Like

No comments:

Post a Comment