how to resize videos as on page like Facebook

Hey All,

I have something similar to the Facebook wall and I want for each YouTube video that gets posted to be displayed as a Thumbnail image and when clicked to expand out to 400px wide by 100% height, like Facebook.

Any ideas on code to get me started with this?

Thanks in Advance,
LVL 1
piixeldesignsAsked:
Who is Participating?
 
piixeldesignsConnect With a Mentor Author Commented:
Here is the code I used

<script type="text/javascript">
        								
        								function adjust(vid) {
											vid.css({ "width":"480px", "height":"390px" });
										}
										
										$("#trackObject_<?php echo $divNum; ?>").live("click", function() {
          									adjust( $(this) );
										});
									</script>

Open in new window


I have other php code above this which basically sources the videos from different video services.
0
 
EMB01Commented:
You could do this with jquery.  Try using this plugin for images which you could probably use for vids, too:

http://plugins.jquery.com/plugin-tags/image-resize

To do the thumbnail, though, you'll have to have a separate graphic, which, when clicked, would display and scale the flash video.
0
 
EMB01Commented:
Moreover, you could just use a lightbox (http://www.huddletogether.com/projects/lightbox/) and then set the properties of the video to 100% of the container like this:

http://stackoverflow.com/questions/2160363/dynamically-resizing-an-embeded-video-with-jquery
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
piixeldesignsAuthor Commented:
I've requested that this question be deleted for the following reason:

None of these were what I was after and are not relevant to the question. I took a different approach in the end. Please delete this question
0
 
Ray PaseurCommented:
What approach did you take?  Please share so we can learn from the way you solved the problem, thanks.
0
 
EMB01Commented:
...  That's exactly what I said to do:  Use jquery to resize the video...  I even provided a plugin.
0
 
EMB01Commented:
Look at this code:
function adjust(vid) {
											vid.css({ "width":"480px", "height":"390px" });
										}

Open in new window

That resizes the video using jquery...  which is precisely what I said to do.  Had he asked how, I would have shown him...  
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.