Youtube Images – What an Idea !!!
Posted on 03. May, 2008 by Sajith M.R in general, html, webworld
Look at the given image carefully …

Did anybody see the above image anywhere ? The Answer might be No. But you might see small parts of this picture. The amazing picture’s name is Youtube Master Image. The Youtube Website contains this single image only, and it uses part by part for different occasions with css ( sytle sheet) property background image and scroll position.
You know the whole youtube website is created with a single image !!!
For example, you see the rating pictures just below the youtube video

Here the fully red star is created by:
<img class=”rating icn_star_full_19×20png“ alt=”“ style=”vertical-align: top;“ src=”http://s.ytimg.com/yt/img/pixel-vfl73.gif“/>
Here the src is merely a 1 pixel image. The actual star lies in the style class “rating icn_star_full_19×20png”
See the style sheet:
.icn_star_full_19x20png
{
transparent url("http://s.ytimg.com/yt/img/master-vfl38353.gif") no-repeat scroll -373px -38px
}
Here scroll -373px and -38px exactly points the red star in the master image.


And for youtube logo, it uses same background image (master image) with another scroll location. Scroll is set to 0px for logo

Like that, all the images, thumbs up , thumbs down, border, scroll back, previous next buttons etc etc are displayed from this single picutre.

Amazing Idea Right ?
(Post your comments please)



Binny V A
May 3rd, 2008
This technique is called CSS Sprites. It reduces http requests. Its an optimization technique for very large sites.
Calling Stroed Procedure from php
May 6th, 2008
Hi
I am trying to call the mysql stored procedure from the php code given below
query($sql1);
while ($data1 = $query1->fetch_row())
{
echo $data1[0].”\n”;
$sql2 = “call getCapitals(\”".$data1[0].”\”)”;Deutschland
//SQL which does the same thing:
//$sql2 = “select concat(country, \”, capital: \”, capital) from countries where country like ‘”.$data1[0].”‘”;
$query2 = $mysqli->query($sql2);
while ($data2 = $query2->fetch_row())
{
echo $data2[0].”\n”;
}
$query2->free(); // unsuccessful attempt to clear the results and get the next SP going
}
?>
Once i Execute the code i am getting the following result
Result:
Deutschland
Fatal error: Call to a member function fetch_row() on a non-object in C:\wamp\www\SMS\Smart\Test\Test.php on line 27
I think the problem is that the stored procedure calling is occurring only once.
Could you please help me to solve this problem?
Thanks in advance
Pradeep
Neenbyday
Oct 7th, 2008
How i may contact admin this site? I have a question.
iijiivei
John605
Nov 7th, 2008
Very nice site!
http://training.cvc4.org/pharm1/14189/4.html
X
Nov 27th, 2008
This method is also promoted in the Yahoo Dev’s top ways to speed up your website. It’s weird though they optimized their http requests so much while their source code is in many places so unoptimized. http request must be a big issue when sites get a lot of traffic.
Joanne Cox
Jun 25th, 2009
Thanks for sharing this; your input is appreciated and has made me change my opinion slightly. About the 3rd paragraph though, could you expand on that a little? I’m a bit confused about what you mean (so maybe others are too).
Christopher
Aug 3rd, 2009
Wow, that is absolutely amazing. Its a fantastic idea…
I might give it a go!
Thanks for the article
diego
Jan 9th, 2010
jajaja
http://s.ytimg.com/yt/img/master-vfl136487.png