Latest from Ricochehost...

Subscribe to the RSS Feed

Video Box and idTabs on Ricochehost

Posted on 04 July 2009 by Jim Atwood Comments

I’ve seen some people on the web creating a video box using idTabs so I thought I would make one too. Again this is nothing new but it was cool to get it working and have it displayed nicely on the front page. The CSS was the tricky part in trying to achieve a particular look for the site, but ultimately I got the look the way I wanted it. My next little project will be creating a smaller version for some of my other sites. I am a big fan of large video since I am a photographer and I want my videos to be HD and “BIG”, but a small Video Box with idTabs would be cool for the sidebar.

New idTabs box on Ricochehost.com

New idTabs box on Ricochehost.com


Jim Atwood on Twitter Click Here to Follow Jim Atwood on Twitter



Possibly Related Posts:


Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • LinkedIn
  • MySpace
  • RSS
  • StumbleUpon
  • Twitter
  • FriendFeed
  • Mixx
  • Reddit
  • Technorati
  • Yahoo! Buzz
  • Tumblr
  • Diigo
  • Netvibes
  • NewsVine
  • Twitthis
  • Yahoo! Bookmarks
  • MisterWong

Tags: , , , , , , , , , , ,

  • I forgot to mention that the tabs take up much space above the video box because it grabs the title of the video post. I may change this to either keywords, numbers, or icons so that I can fit any number of videos into the box. Right now I have it set for two, so stay tuned as I have quite a few videos I would like to add.
PHVsPjxsaT48c3Ryb25nPndvb19hYm91dDwvc3Ryb25nPiAtIFdlbGNvbWUgdG8gUmljb2NoZWhvc3QgUHJlbWl1bSBCbG9nIFNvbHV0aW9uczwvbGk+PGxpPjxzdHJvbmc+d29vX2Fkc19pbm5lcl9jb250ZW50PC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2Fkc19yb3RhdGU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfMTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cucmljb2NoZWhvc3QuY29tL2ltYWdlcy9hZHMvZ3JlZW4uanBnPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfMjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cucmljb2NoZWhvc3QuY29tL2ltYWdlcy9hZHMva2ltb25vLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2ltYWdlXzM8L3N0cm9uZz4gLSBodHRwOi8vd3d3LnJpY29jaGVob3N0LmNvbS9pbWFnZXMvYWRzL3NtaWxlLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2ltYWdlXzQ8L3N0cm9uZz4gLSBodHRwOi8vd3d3LnJpY29jaGVob3N0LmNvbS9pbWFnZXMvYWRzL3plbmtvamkuanBnPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfNTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cucmljb2NoZWhvc3QuY29tL2ltYWdlcy9hZHMvZmF2b3JpdGVzLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF8xPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5mbGlja3IuY29tL3Bob3Rvcy9qaW1hdHdvb2Qvc2V0cy83MjE1NzYwNjIxNzQ5MjIyNS88L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfMjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuZmxpY2tyLmNvbS9waG90b3MvamltYXR3b29kL3NldHMvNzIxNTc2MDMyMTY3NTA4MzMvPC9saT48bGk+PHN0cm9uZz53b29fYWRfdXJsXzM8L3N0cm9uZz4gLSBodHRwOi8vd3d3LmZsaWNrci5jb20vcGhvdG9zL2ppbWF0d29vZC9zZXRzLzcyMTU3NjAyNjI5MzI2MTk3LzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF80PC9zdHJvbmc+IC0gaHR0cDovL3d3dy5mbGlja3IuY29tL3Bob3Rvcy9qaW1hdHdvb2Qvc2V0cy83MjE1NzYwMjYyMjY1MTQ5OC88L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfNTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuZmxpY2tyLmNvbS9waG90b3MvamltYXR3b29kL3NldHMvNzIxNTc2MDMzMDc5OTY1MDUvPC9saT48bGk+PHN0cm9uZz53b29fYWx0X3N0eWxlc2hlZXQ8L3N0cm9uZz4gLSB3aGl0ZS1ibHVlLmNzczwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9leDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9tZW51PC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19jb21tZW50X3Bvc3RzPC9zdHJvbmc+IC0gMjwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnRfYXJjaGl2ZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY29udGVudF9ob21lPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19jdXN0b21fY3NzPC9zdHJvbmc+IC0gLmZsaWNrci1taW5pLWdhbGxlcnkgaW1nICB7DQoJYm9yZGVyOiAxcHggc29saWQgI2RiZGJkYjsNCgltYXJnaW46IDJweDsNCn0NCg0KI2ZsaWNrcm1pbmkgaW1nICB7DQoJYm9yZGVyOiAxcHggc29saWQgI2RiZGJkYjsNCgltYXJnaW46IDJweDsNCn0NCg0KLmF1dGhvcl9pbmZvIHsNCglwYWRkaW5nOiA1cHg7DQoJbWFyZ2luLXRvcDoxNXB4Ow0KCWNvbG9yOiM2NjY2NjY7DQoJYm9yZGVyOiAxcHggZGFzaGVkICNkYmRiZGI7DQogICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmZmY2M7DQp9DQoNCi5hdXRob3JfcGhvdG8gew0KCWZsb2F0OmxlZnQ7DQoJbWFyZ2luLXJpZ2h0OjEwcHg7DQoJd2lkdGg6NThweDsNCn0NCg0KLmF1dGhvcl9waG90byBpbWcgew0KCWJhY2tncm91bmQtY29sb3I6ICNGRkZGRkY7DQoJcGFkZGluZzogNHB4Ow0KCWJvcmRlcjogMXB4IHNvbGlkICNjY2NjY2M7DQoJd2lkdGg6IDQ4cHg7DQoJaGVpZ2h0OjQ4cHg7DQoJZmxvYXQ6bGVmdCAhaW1wb3J0YW50Ow0KfQ0KLmF1dGhvcl9pbmZvIHAgew0KCWZvbnQtc2l6ZToxMnB4Ow0KCXBhZGRpbmc6MHB4Ow0KCW1hcmdpbi1ib3R0b206MTBweDsNCn0NCi5hdXRob3JfaW5mbyBhIHsNCgljb2xvcjojMDAwMDAwOw0KCXRleHQtZGVjb3JhdGlvbjpub25lOw0KCXBhZGRpbmc6MDsNCn0NCi5hdXRob3JfaW5mbyBhOmhvdmVyIHsNCgl0ZXh0LWRlY29yYXRpb246dW5kZXJsaW5lOw0KfQ0KLmF1dGhvcl9pbmZvIHVsLCAuYXV0aG9yX2luZm8gbGkgew0KCW1hcmdpbjowcHg7DQoJcGFkZGluZzowcHg7DQp9DQouYXV0aG9yX2luZm8gaDMgew0KCWZvbnQtc2l6ZToxNHB4Ow0KCW1hcmdpbi1ib3R0b206IDEwcHg7DQoJcGFkZGluZzogMHB4Ow0KfQ0KDQouYXV0aG9yX2VtYWlsIGEgew0KCWJhY2tncm91bmQtaW1hZ2U6IHVybChpbWFnZXMvaWNvLWVtYWlsLnBuZyk7DQoJYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDsNCgliYWNrZ3JvdW5kLXBvc2l0aW9uOiBsZWZ0IGNlbnRlcjsNCglwYWRkaW5nLWxlZnQ6IDI2cHg7DQoJcGFkZGluZy10b3A6IDJweDsNCglwYWRkaW5nLWJvdHRvbTogMnB4Ow0KCXRleHQtZGVjb3JhdGlvbjpub25lOw0KCWZvbnQtd2VpZ2h0OmJvbGQ7DQp9PC9saT48bGk+PHN0cm9uZz53b29fY3VzdG9tX2Zhdmljb248L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19kZWxpY2lvdXM8L3N0cm9uZz4gLSBqaW1hdHdvb2Q8L2xpPjxsaT48c3Ryb25nPndvb19kaWdnPC9zdHJvbmc+IC0gaHR0cDovL2RpZ2cuY29tL3VzZXJzL2ppbWF0d29vZDwvbGk+PGxpPjxzdHJvbmc+d29vX2ZhY2Vib29rPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5mYWNlYm9vay5jb20vamltLmQuYXR3b29kPC9saT48bGk+PHN0cm9uZz53b29fZmF2aWNvbjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cucmljb2NoZWhvc3QuY29tL2Zhdmljb24uaWNvPC9saT48bGk+PHN0cm9uZz53b29fZmVlZGJ1cm5lcl91cmw8L3N0cm9uZz4gLSBodHRwOi8vZmVlZHMuZmVlZGJ1cm5lci5jb20vUmljb2NoZWhvc3Q8L2xpPjxsaT48c3Ryb25nPndvb19mbGlja3I8L3N0cm9uZz4gLSBqaW1hdHdvb2Q8L2xpPjxsaT48c3Ryb25nPndvb19nb29nbGVfYW5hbHl0aWNzPC9zdHJvbmc+IC0gPHNjcmlwdCB0eXBlPVwidGV4dC9qYXZhc2NyaXB0XCI+DQp2YXIgZ2FKc0hvc3QgPSAoKFwiaHR0cHM6XCIgPT0gZG9jdW1lbnQubG9jYXRpb24ucHJvdG9jb2wpID8gXCJodHRwczovL3NzbC5cIiA6IFwiaHR0cDovL3d3dy5cIik7DQpkb2N1bWVudC53cml0ZSh1bmVzY2FwZShcIiUzQ3NjcmlwdCBzcmM9XCdcIiArIGdhSnNIb3N0ICsgXCJnb29nbGUtYW5hbHl0aWNzLmNvbS9nYS5qc1wnIHR5cGU9XCd0ZXh0L2phdmFzY3JpcHRcJyUzRSUzQy9zY3JpcHQlM0VcIikpOw0KPC9zY3JpcHQ+DQo8c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4NCnRyeSB7DQp2YXIgcGFnZVRyYWNrZXIgPSBfZ2F0Ll9nZXRUcmFja2VyKFwiVUEtNjczNDc3LTExXCIpOw0KcGFnZVRyYWNrZXIuX3RyYWNrUGFnZXZpZXcoKTsNCn0gY2F0Y2goZXJyKSB7fTwvc2NyaXB0PjwvbGk+PGxpPjxzdHJvbmc+d29vX2dyYXZhdGFyPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5ncmF2YXRhci5jb20vYXZhdGFyLzYyYjBjZGJjOTg3ZTI4N2M0ZDRmN2VlMWQ4NTY4ZjI1LnBuZzwvbGk+PGxpPjxzdHJvbmc+d29vX2hvbWVfcG9zdHM8L3N0cm9uZz4gLSAxPC9saT48bGk+PHN0cm9uZz53b29faG9tZV90aXRsZTwvc3Ryb25nPiAtIExhdGVzdCBmcm9tIFJpY29jaGVob3N0Li4uPC9saT48bGk+PHN0cm9uZz53b29fbGFzdGZtPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5sYXN0LmZtL3VzZXIvamltYXR3b29kPC9saT48bGk+PHN0cm9uZz53b29fbGF5b3V0PC9zdHJvbmc+IC0gMmNvbC5waHA8L2xpPjxsaT48c3Ryb25nPndvb19saW5rZWRpbjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cubGlua2VkaW4uY29tL2luL2ppbWF0d29vZDwvbGk+PGxpPjxzdHJvbmc+d29vX2xvZ288L3N0cm9uZz4gLSBodHRwOi8vd3d3LnJpY29jaGVob3N0LmNvbS93cC1jb250ZW50L3dvb191cGxvYWRzLzMtbG9nby10cmFuczIucG5nPC9saT48bGk+PHN0cm9uZz53b29fbWFudWFsPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL3N1cHBvcnQvdGhlbWUtZG9jdW1lbnRhdGlvbi9nZW9tZXRyaWMvPC9saT48bGk+PHN0cm9uZz53b29fbmF2X2V4Y2x1ZGU8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19uYXZfZm9vdGVyPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX25hdl9ob21lX3BhZ2VzPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX3BhZ2VfZXg8L3N0cm9uZz4gLSAyOSw1OCwxMzk8L2xpPjxsaT48c3Ryb25nPndvb19wb3B1bGFyX3Bvc3RzPC9zdHJvbmc+IC0gMjwvbGk+PGxpPjxzdHJvbmc+d29vX3BvcnRmb2xpb19jYXRlZ29yeTwvc3Ryb25nPiAtIFBvcnRmb2xpbzwvbGk+PGxpPjxzdHJvbmc+d29vX3BvcnRmb2xpb19wb3N0czwvc3Ryb25nPiAtIDEyPC9saT48bGk+PHN0cm9uZz53b29fcG9ydGZvbGlvX3Jlc2l6ZXI8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fcmlnaHRfc2lkZWJhcjwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19zaG9ydG5hbWU8L3N0cm9uZz4gLSB3b288L2xpPjxsaT48c3Ryb25nPndvb19zdHVtYmxlPC9zdHJvbmc+IC0gaHR0cDovL2ppbWF0d29vZC5zdHVtYmxldXBvbi5jb20vPC9saT48bGk+PHN0cm9uZz53b29fdGhlbWVuYW1lPC9zdHJvbmc+IC0gR2VvbWV0cmljPC9saT48bGk+PHN0cm9uZz53b29fdHdpdHRlcl91c2VyPC9zdHJvbmc+IC0gSmltQXR3b29kPC9saT48bGk+PHN0cm9uZz53b29fdXBsb2Fkczwvc3Ryb25nPiAtIGh0dHA6Ly93d3cucmljb2NoZWhvc3QuY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvMy1sb2dvLXRyYW5zMi5wbmc8L2xpPjxsaT48c3Ryb25nPndvb195b3V0dWJlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy55b3V0dWJlLmNvbS91c2VyL0ppbUF0d29vZDwvbGk+PC91bD4=