Pages

Tuesday 24 July 2012

How to Make Your Grid Pan Automatically (HTML5/JS/CSS3 Metro Style APP)

I got a question at an event a few weeks ago that sounded at first like it was going to implicate a rather complicated answer. In the end, it turned out to be not so bad.
The question was…
On the start screen when the user moves his mouse to the edge, the tiles pan automatically. How do I make the grid in my app work just like that?
And the answer - or rather an answer is here…

var timer = null;
element.querySelector(".groupeditemslist").onmousemove = function (ev) {
    clearInterval(timer);
    timer = -1;
    if (ev.screenX > (document.body.scrollWidth - 50))
        timer = setInterval(function () { listView.scrollPosition += 30; }, 1);
    else if (ev.screenX < 50)
        timer = setInterval(function () { listView.scrollPosition -= 30; }, 1);
};

Read full article here

 

No comments:

Post a Comment

Web Informer Button