Can I dynamically change the height of a widget?


#1

I’ve been struggling with this for the last couple hours, and I can’t seem to find a solution. I know you can set the width/height of a widget in the HTML tags, but in my website I have the content sized depending on the size of the browser.

All I want is for the Twitter widget to completely expand to it’s container (both width and height). By default, the width is expanded, but the height is not. I’m curious as to why this is, and if there’s a way around it.

Thanks,
Cohen


#2

Although I’d still like to know why you can’t dynamically change the height of a widget, I did solve my problem.

Since the height of the widget depends on the height of the browser, I used some simple jQuery to insert the widget after the page has loaded:

$(document).ready(function(){
var twitHeight = (window.innerHeight - $("footer").height() - $("header").height());
console.debug(twitHeight);	

// insert twitter widget
$('<a class="twitter-timeline" height="'+twitHeight+'" href="https://twitter.com/cohenadair" data-widget-id="353326092804833282">Tweets by @cohenadair</a>').insertAfter("#twitter-loc");

!function(d, s, id) {
	var js, fjs = d.getElementsByTagName(s)[0], p=/^http:/.test(d.location)?'http':'https';
	if (!d.getElementById(id)) {
		js = d.createElement(s);
		js.id = id;
		js.src = p+"://platform.twitter.com/widgets.js";
		fjs.parentNode.insertBefore(js, fjs);
	}
}(document, "script", "twitter-wjs");

});


#3

Hey,
I’ve had a look at this because i want to do exactly the same. Do you put something in the html to call the function?
Cheers


#4

Yes. I have an additional function, insertTwitter() that I call in the HTML document where I want it placed (in my case after the navigation bar). Here’s the code:

// inserts the twitter feed into the body; used to avoid repeated code function insertTwitter(homePath) { document.write('
'); document.write('
'); document.write('
'); document.write('
'); } #twitter-wrapper { width: 250px; height: 100%; }

I’ve noticed the height of the widget will change with a slight delay at times, but most of the time it isn’t noticeable.


#5

I feel like an imbecile asking this, but how exactly do I use this js, and how do I call the insertTwitter() function into my html?


#6

Still cannot figure this out…


#7