File: examples/storage1.html

Recommend this page to a friend!
  Classes of Thomas Björk   jQuery Load Favicon   examples/storage1.html   Download  
File: examples/storage1.html
Role: Example script
Content type: text/plain
Description: Example for webstorage
Class: jQuery Load Favicon
jQuery plugin to load an image as page favicon
Author: By
Last change: Updated the name for the plugin from utils.js to jquery.utils.js
Added a compiled and minified version
Updated all examples with the new name (using the minified version in the examples)
Added functions to convert an image to canvas, store data in webStorage.
Added animations to favicons
Date: 2 years ago
Size: 2,243 bytes


Class file image Download
<!DOCTYPE html> <html> <head> <title>Storage - Demo 1</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- load jQuery --> <script src=""></script> <!-- load utils --> <script src="../jquery.utils-min.js"></script> <script> jQuery(document).ready(function() { var value; if('testValue1')) { value = JSON.stringify('testValue1')); console.log('testValue1')); } else { value = '- No value set....yet! -'; } jQuery('#storedValue').html(value); jQuery('#demoStorage').val(''); }); function SetValue() { var value;'testValue1', jQuery('#demoStorage').val()); if('testValue1')) { value = JSON.stringify('testValue1')); } else { value = '- No value set....yet! -'; } jQuery('#storedValue').html(value); jQuery('#demoStorage').val(''); return false; } </script> </head> <body> <h1>Storage - Demo 1</h1> <div> The last value was: <span id="storedValue"></span><br /> <br /> <em style="font-size: 80%;">The storage component will primarily check for and use localStorage. If localStorage isn't available then it tries to use sessionStorage. If sessionStorage fails as well then a simple key-value store is setup within the module.<br /> The localStorage will preserve data until removed.<br /> The sessionStorage will preserve data until the current session ends<br /> The local key-value store will keep the data until the page is reloaded</em> </div> <br /> <br /> <br /> <hr /> <form action="#"> <input type="text" name="demoStorage" id="demoStorage" value="" /> <button onclick="return SetValue();">Set value</button> </form> <ul> <li><a href="./index.html" title="Index">Index</a></li> <li><a href="./storage1.html" title="Storage 1">Storage 1</a></li> </ul> </body> </html>