Conflict jQuery and JSON

Douglas Crockfords json.js and John Resigs jquey.js conflict with each other. This is caused by a flaw in Javascript that is described in this article: http://yuiblog.com/blog/2006/09/26/for-in-intrigue/

So what do you do... Both libraries are really well written. and I haven't found any decent alternatives for Douglas json or Resigs jquery. So correct json or correct jQuery?

Of course the for..in loops in jQuery should be fixed. But fixing json.js is a more pragmatic aproach of the problem. Fixing json.js is a lot easier then fixing jQuery and more importantly json.js will have probably far less new versions and releases as jQuery. So the effort to stay up to date will be a lot smaller.

The adjusted version can be downloaded: json-noaugmenting.js

bug in IE7 when you change position of elements when pagezoom is used

In my humble opinion the pagezoom in IE7 is one of the most underestimated improvements of IE. Okay it has its flaws but it is a lot better then just resizing font-sizes. And imagine what you can do with it... now you can actually zoomin on the complete user interface of an application. I haven't seen any desktop application yet that can do just that.

But this pagezoom functionality also turns out to be one buggy $#%%^&$. (sorry for that)

What's wrong?
Just zoom your page to 125% and dynamically reposition an element with text in it. IE7 mispositions the text completely and it does it in a pretty random way. When you resize the browser window, after repositioning your element, IE7 will force some kind of redraw of the page and the problem will be corrected.

This a test page before repositioning:







this it what happens after repositioning the div 200px to the right:







You see what happens?! Even the text in the button is not rendered well!

Then resize the window:

And voila... all is fine....

For an working example click here. (don't forget to set the zoom level of the page)

What does that mean?
This makes for example drag&drop in IE7 within a zoomed page almost impossible.

The solution?
You tell me. I am still looking, i have tried a lot of options. The weird thing is that I haven't found any mention of this problem on the net. All the well known libraries don't seem to have a solution. I have checked YUI, mootools, pkk's new drag&drop script and backbase.

So if you have any idea let me know as soon as i find something I will publish it here.

added 14-8-2007 17:21
okay i have something that works... it is really ugly and needs to be improved (broswer detection, pagezoom detection, values relative to page) but it is a start:

function shakeItUp(){
document.getElementsByTagName("body")[0].style.height="10000px";
window.scrollBy(0,6000);
window.scrollBy(0,-6000);
document.getElementsByTagName("body")[0].style.height="auto";
}

After repositioning your element just shakeItUp()

click here for an working example