I\'m trying to customise the new Twitter widget, but having some problems with the CSS and can\'t seem to override theirs on this new one. I\'ve tried searching for solution
This is without jQuery for anyone interested.
UPDATED with much better solution that doesn't rely on polling and therefore doesn't have a flash of unstyled layout on occasion:
twttr.events.bind('rendered',function(){
[].slice.call(document.querySelectorAll('iframe.twitter-timeline')).forEach(function(e,i,a){
var fE = e.contentDocument.getElementsByClassName('timeline-footer');
if(fE.length){
fE[0].style.backgroundColor='transparent';
}
});
});
old version:
// Customize twitter feed
var hideTwitterAttempts = 0;
function hideTwitterBoxElements() {
setTimeout( function() {
var list = document.getElementsByTagName('iframe');
if (list.length ) {
Array.prototype.forEach.call(
list,
function(element){
var footerE = element.contentDocument.getElementsByClassName('timeline-footer')[0];
footerE.style.backgroundColor="transparent";
});
}
hideTwitterAttempts++;
if ( hideTwitterAttempts < 3 ) {
hideTwitterBoxElements();
}
}, 1500);
}
hideTwitterBoxElements();