<html>
							 | 
						|
								    <head>
							 | 
						|
								        <title>Timeline | itemsAlwaysDraggable Option</title>
							 | 
						|
								        <meta charset="utf-8">
							 | 
						|
								        <script src="../../../dist/vis.js"></script>
							 | 
						|
								        <link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
							 | 
						|
								    </head>
							 | 
						|
								    <body>
							 | 
						|
								        <p>The <code>itemsAlwaysDraggable</code> option allows to drag items around without first selecting them. When <code>itemsAlwaysDraggable.range</code> is set to <code>true</code>, the range can be changed without selection as well.</p>
							 | 
						|
								        <div id="mytimeline"></div>
							 | 
						|
								
							 | 
						|
								        <script>
							 | 
						|
								            var container = document.getElementById('mytimeline'),
							 | 
						|
								                items = new vis.DataSet();
							 | 
						|
								
							 | 
						|
								            for (var i = 10; i >= 0; i--) {
							 | 
						|
								                var start = new Date(new Date().getTime() + i * 100000);
							 | 
						|
								                items.add({
							 | 
						|
								                    id: i,
							 | 
						|
								                    content: "item " + i,
							 | 
						|
								                    start: start,
							 | 
						|
								                    end: new Date(start.getTime() + 100000)
							 | 
						|
								                });
							 | 
						|
								            }
							 | 
						|
								
							 | 
						|
								            var options = {
							 | 
						|
								                start: new Date(),
							 | 
						|
								                end: new Date(new Date().getTime() + 1000000),
							 | 
						|
								                editable: true,
							 | 
						|
								                itemsAlwaysDraggable: {
							 | 
						|
								                    item: true,
							 | 
						|
								                    range: true
							 | 
						|
								                }
							 | 
						|
								            };
							 | 
						|
								            var timeline = new vis.Timeline(container, items, null, options);
							 | 
						|
								        </script>
							 | 
						|
								    </body>
							 | 
						|
								</html>
							 |