根据屏幕大小激活和删除jQuery Mobile listview

Question

我希望只有在屏幕宽度低于某个值（比如480px）时才能使用jQuery Mobile“listviews”格式。如果屏幕较大，则会显示常规的html列表（我将使用自己的CSS设置样式）。

我很接近，但我遇到的问题是我的代码仅适用于一个调整大小。

看我的小提琴：http://jsfiddle.net/5Qv4Y/ 并在小于480的位置拖动预览窗口，并查看常规列表转到JQM列表。把它带回480以上，然后又恢复正常...但是它不再起作用了。我希望能够来回走动并且每次更改列表。

这是我的代码：

// fire if window is 480 or less on load
    var windowsize = $(window).width();
        if (windowsize <= 480) {
            $("ul").listview();

        }

 // change on screen resize (in theory)   
    $(window).resize(function () {
        var windowsize = $(window).width();
        if (windowsize <= 480) {
            $("ul").listview();

        }

        if (windowsize > 480) {
            $("ul").removeClass("ui-listview");
            $("li").removeClass("ui-li ui-li-static ui-btn-up-c");
        }


    });

为什么这不能正常工作？