Question

i have created a Windows 8 app using HTML & JavaScript.

Here i want to slide a div[contains two textbox and a button] from right side of the screen towards left.

hopes the question is clear.

Answer 1

Problem solved by using the following piece of code:

CSS:
  position: fixed;  
  right: 0px;
  top: 0px;
  width: 308px;
  height: 100%;
  color: white;
  background-color: bisque;
  opacity: 0;
  z-index: 1;

Then in JavaScript I have just set the opacity property to one.

JS:

 (function () {
 "use strict";
 var page = WinJS.UI.Pages.define("/default.html", {
     ready: function (element, options) {
         btnname.addEventListener("click", togglePanelUI, false);

         myPanel = element.querySelector("#divname");        }     //div name is name of div which u wants to slide
 });

 var animating = WinJS.Promise.wrap();
 var myPanel;
 function togglePanelUI() {               // If element is already animating, wait until current animation is complete before starting the show animation.
     animating = animating
        .then(function () {
            // Set desired final opacity on the UI element.
            myPanel.style.opacity = "1";

            // Run show panel animation.
            // Element animates from the specified offset to its actual position.
            // For a panel that is located at the edge of the screen, the offset should be the same size as the panel element.
            // When possible, use the default offset by leaving the offset argument empty to get the best performance.
            return WinJS.UI.Animation.showPanel(myPanel);
        });

}
})();

for more information regarding animations of windows 8, have a look at here