Problems with IE7
PhilMarshall
I'm doing my first project using local storage and I'm getting "Error:
JSON is undefined: on the store command (line 16) although the store
(retrieve) commands on lines 25 & 26 don't cause a problem. I'm using
amplify.js because it is supposed to deal with IE7 (and other browser
issues). Here is my simple test case (not the production code). I'm
not using jqueryui on the production page, so I know that's not the
issue. I've also tried several different versions of jQuery - I get
the same issue with all of them.
<code>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/
jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/
jquery-ui.min.js" type="text/javascript"></script>
<script src="amplify.min.js" type="text/javascript"></script>
<style>
#draggable { width:150px; height:50px; padding:0.5em; border:
1px solid red; background:#fee; text-align:center; vertical-
align:middle; }
.demo { position:absolute; left:100px; top:50px; width:600px;
height:600px; border:1px solid blue; background:#eef; text-
align:center; }
</style>
<script>
$(function() {
$("#draggable").draggable({
containment: 'parent',
stop: function(event, ui) {
// save the box position in local storage
amplify.store('drag-demo-left', ui.position.left);
amplify.store('drag-demo-top', ui.position.top);
}
});
$(document).ready(function(event){
// Get the saved location from local storage
x = amplify.store('drag-demo-left');
y = amplify.store('drag-demo-top');
$("#draggable").css('left', x);
$("#draggable").css('top', y);
});
});
</script>
</head>
<body>
<div class="demo">
<div id="draggable" class="ui-widget-content">
<p>Drag me around</p>
</div>
Move the draggable object by clicking on it with the
mouse.<br>Drag it anywhere within this box.
</div>
</body>
</html>
</code>
