Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Telegraph interactive loading. If mobile adds a link to open in seperate window, if desktop adds the interactive with an iframe.
// http://www.telegraph.co.uk/sport/football/world-cup/10886068/England-World-Cup-team-selector.html
<script type="text/javascript">
var parentElm = document.getElementsByTagName('script'),
domOutput = document.createElement('div');
parentElm = parentElm[ parentElm.length-2 ];
if(Telegraphics.Modernizr.mobileonmobilesite) {
var lnk=document.createElement('link');
lnk.setAttribute('rel','stylesheet');
lnk.setAttribute('type','text/css');
lnk.setAttribute('href','http://s.telegraph.co.uk/graphics/MobileSwitcher/assets/mobile.css');
domOutput.appendChild(lnk);
domOutput.innerHTML += '<div class="telegraphics-mobile"><a target="_blank" href="http://s.telegraph.co.uk/graphics/html/Years/2014/June/EnglandSquadSelector/index.html"><div class="overlay"><div class="message"><div class="finger"><span> </span></div><div class="text"><strong>Open graphic</strong><br/><i>(opens in new window)</i></div></div></div><img alt="World Cup - England Squad Selector" class="image" src="http://s.telegraph.co.uk/graphics/MobileSwitcher/thumbnails/225-1774846356.png"/></a></div>';
}
else {
domOutput.innerHTML = '<iframe src="http://s.telegraph.co.uk/graphics/html/Years/2014/June/EnglandSquadSelector/index.html" width="940" height="950" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" id="domGraphicFrame_WorldCup"><noframes>World Cup - England Squad Selector</noframes></iframe>';
}
parentElm.parentNode.insertBefore(domOutput, parentElm);
var frame = document.getElementById('domGraphicFrame_WorldCup');
if( frame !== null ){
frame.onload = function(){
frame.contentWindow.postMessage(window.location.hash,'*');
};
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment