iframe move without reload
by Destan Sarpkaya
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div class="target"></div>
<div id='iframe-container'>
<embed src="https://2017.cssconf.eu/"></embed>
</div>
<button onclick="moveIframe()">move iframe</button>
<script>
function moveIframe() {
console.log('moving iframe')
var iframeContainer = document.getElementById('iframe-container')
var boxLeftPos = iframeContainer.offsetLeft ;
iframeContainer.style.left = (boxLeftPos + 10 * 10) + 'px';
}
</script>
</body>
</html>
CSS
#iframe-container {
position: absolute;
left:0px;
top:0px;
width:300px;
height:50px;
}
button{
position: absolute;
left:0px;
top:150px;
width:300px;
height:50px;
}
JavaScript
//Script is Embeded on the Html File