Some years ago, I built in my CMS a customisable twitter widget, for embedded use in web pages. This stopped working since twitter yanked out support last week.
The new timeline widget misses the autoscroll option, but I can live with that.
But it sadly creates several cascading iframes (iframe><iframe></iframe></iframe>), so I need a method to tweak font sizes, colors etcetera in the iframes created by twitter.
so far I have come up with this:
function tweakstyle() {
var iframe = top.frames[0].frames[0].document; // this is the line that generates the cross domain error
var otherhead = iframe.getElementsByTagName("head")[0];
var ilink = iframe.createElement("link");
ilink.setAttribute("rel", "stylesheet");
ilink.setAttribute("type", "text/css");
ilink.setAttribute("href", "style.css");
var styles = otherhead.appendChild(ilink);
var css = '' +
'.timeline { font-size:11px !important; color:red;}' +
'';
styles.innerHTML = css;
}
setTimeout('tweakstyle()',1000); // to make sure the twitter code has generated it's stuff
But that gave me an invalid cross domain error on the first line.
Does anybody have a suggestion? I googled and none of the solutions that came up work for me.