| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849 | 
							- <!DOCTYPE html>
 
- <html>
 
- <head>
 
- 	<meta charset="utf-8">
 
- 	<title>IFrame playground</title>
 
- </head>
 
- <body>
 
- <!-- Latest compiled and minified CSS -->
 
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
 
- <!-- Latest Sortable -->
 
- <script src="../../Sortable.js"></script>
 
- <!-- Simple List -->
 
- <div id="simpleList" class="list-group">
 
- 	<div class="list-group-item">This is <a href="http://rubaxa.github.io/Sortable/">Sortable</a></div>
 
- 	<div class="list-group-item">It works with Bootstrap...</div>
 
- 	<div class="list-group-item">...out of the box.</div>
 
- 	<div class="list-group-item">It has support for touch devices.</div>
 
- 	<div class="list-group-item">Just drag some elements around.</div>
 
- </div>
 
- <script>
 
- 	(function () {
 
- 		Sortable.create(simpleList, {group: 'shared'});
 
- 		var iframe = document.createElement('iframe');
 
- 		iframe.src = 'frame.html';
 
- 		iframe.width = '100%';
 
- 		iframe.onload = function () {
 
- 			var doc = iframe.contentDocument,
 
- 					list = doc.getElementById('listWithHandle');
 
- 			Sortable.create(list, {group: 'shared'});
 
- 		};
 
- 		document.body.appendChild(iframe);
 
- 	})();
 
- </script>
 
- </body>
 
- </html>
 
 
  |