diff --git a/examples/network/other/onLoadAnimation.html b/examples/network/other/onLoadAnimation.html
new file mode 100644
index 00000000..c6c2b190
--- /dev/null
+++ b/examples/network/other/onLoadAnimation.html
@@ -0,0 +1,85 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+  <title>Network | On Load Animation</title>
+  <script type="text/javascript" src="../../../dist/vis.js"></script>
+  <link href="../../../dist/vis-network.min.css" rel="stylesheet" type="text/css" />
+  <style type="text/css">
+    #mynetwork {
+      width: 600px;
+      height: 400px;
+      border: 1px solid lightgray;
+    }
+  </style>
+</head>
+<body>
+  <h2>Vis.js network onLoad animation</h2>
+  <p>easeIn functions accelerate from zero velocity.</p> 
+  <p>easeOut functions decelerate to zero velocity.</p>
+  <p>easeInOut functions accelerate from zero till halfway then after the halfway point they decrease until zero.</p>
+  <div>
+  Onload Animation Easing Function - 
+    <select id="easingFunction">
+	  <option value="linear">linear</option>
+	  <option value="easeInQuad">easeInQuad</option>
+	  <option value="easeOutQuad">easeOutQuad</option>
+	  <option value="easeInOutQuad">easeInOutQuad</option>
+	  <option value="easeInCubic">easeInCubic</option>
+	  <option value="easeOutCubic">easeOutCubic</option>
+	  <option value="easeInOutCubic">easeInOutCubic</option>
+	  <option value="easeInQuart">easeInQuart</option>
+	  <option value="easeOutQuart">easeOutQuart</option>
+	  <option value="easeInOutQuart">easeInOutQuart</option>
+	  <option value="easeInQuint">easeInQuint</option>
+	  <option value="easeOutQuint">easeOutQuint</option>
+	  <option value="easeInOutQuint">easeInOutQuint</option>
+    </select>
+    <button onClick="createNetwork(document.getElementById('easingFunction').value);">Demo Easing Function</button>
+  </div>
+  <p>For more information on easing functions check out <a href="http://easings.net/">easings.net</a></p>
+  <div id="mynetwork"></div>
+  <script type="text/javascript">
+  document.getElementById("easingFunction").selectedIndex = 0;
+  function createNetwork(easingType) {
+    var nodes = new vis.DataSet([
+      {id: 1, label: 'Node 1'},
+      {id: 2, label: 'Node 2'},
+      {id: 3, label: 'Node 3'},
+      {id: 4, label: 'Node 4'},
+      {id: 5, label: 'Node 5'}
+    ]);
+
+    var edges = new vis.DataSet([
+      {from: 1, to: 3},
+      {from: 1, to: 2},
+      {from: 2, to: 4},
+      {from: 2, to: 5}
+    ]);
+
+    var container = document.getElementById('mynetwork');
+    var data = {
+      nodes: nodes,
+      edges: edges
+    };
+    var options = {};
+    var network = new vis.Network(container, data, options); 
+    network.once("beforeDrawing", function() {
+      network.focus(2, {
+        scale: 12
+      });
+    });
+    network.once("afterDrawing", function() {
+      network.fit({
+        animation: {
+          duration: 3000,
+          easingFunction: easingType
+        }
+      });
+    });
+  }
+  createNetwork("linear");
+  </script>
+</body>
+</html>
+
