jczaplew/index.html

## index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<style>
  #content {
    margin:2%;
    padding:20px;
    border:2px solid #d0d0d0;
    border-radius: 5px;
  }
  #contentSvg {
    width:100%;
  }
</style>
</head>
<body>
  <div id="content"></div>

  <script type="text/javascript">
  // Load SVG
    var content = document.getElementById("content");
    var svg = document.createElement("object");
    svg.type = "image/svg+xml";
    svg.id = "contentSvg";
    svg.data = "tdm.svg";
    content.appendChild(svg);

  // Resize svg
    function resize() {
      var object = document.getElementById("contentSvg"),
          objectDoc = object.contentDocument,
          layer = objectDoc.getElementById("Layer 1");

      layer.setAttribute("transform", "scale(" + content.offsetWidth/900 + ")");
      object.setAttribute("height", content.offsetWidth*0.7);
    }

  // Resize on load
    setTimeout(resize, 100);

  // Add resize listener
    window.addEventListener("resize", resize);

  </script>
</body>
</html>

## tdm.svg

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              tdm.svg
            
          
      Loading

      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<style>
	#content {
	margin:2%;
	padding:20px;
	border:2px solid #d0d0d0;
	border-radius: 5px;
	}
	#contentSvg {
	width:100%;
	}
	</style>
	</head>
	<body>
	<div id="content"></div>

	<script type="text/javascript">
	// Load SVG
	var content = document.getElementById("content");
	var svg = document.createElement("object");
	svg.type = "image/svg+xml";
	svg.id = "contentSvg";
	svg.data = "tdm.svg";
	content.appendChild(svg);

	// Resize svg
	function resize() {
	var object = document.getElementById("contentSvg"),
	objectDoc = object.contentDocument,
	layer = objectDoc.getElementById("Layer 1");

	layer.setAttribute("transform", "scale(" + content.offsetWidth/900 + ")");
	object.setAttribute("height", content.offsetWidth*0.7);
	}

	// Resize on load
	setTimeout(resize, 100);

	// Add resize listener
	window.addEventListener("resize", resize);

	</script>
	</body>
	</html>