Tuesday, November 22, 2011

360 degree rotation of any Web page/site

With "do a barrel roll" search easter egg of google becoming famous(if your haven't tried it yet just try it now and comeback here) and the stuff of the same and other easter eggs being explained in our previous blog post named A Mega List of 56 Google Easter eggs.

This page doing a barrel roll when loaded can be observed. this can be done by adding javascript codes in the page.

The 360 degree rotation of the page can be done in 2 ways

1) by adding the javascript code as the link in that page will make the page do a barrel roll on its own like this TipsNTweaks Barrel Roll.

Adding the code


javascript:(function(){(function(){var%20s=document.createElement('style');s.innerHTML='%40-moz-keyframes%20roll%20{%20100%25%20{%20-moz-transform:%20rotate(360deg);%20}%20}%20%40-o-keyframes%20roll%20{%20100%25%20{%20-o-transform:%20rotate(360deg);%20}%20}%20%40-webkit-keyframes%20roll%20{%20100%25%20{%20-webkit-transform:%20rotate(360deg);%20}%20}%20body{%20-moz-animation-name:%20roll;%20-moz-animation-duration:%204s;%20-moz-animation-iteration-count:%201;%20-o-animation-name:%20roll;%20-o-animation-duration:%204s;%20-o-animation-iteration-count:%201;%20-webkit-animation-name:%20roll;%20-webkit-animation-duration:%204s;%20-webkit-animation-iteration-count:%201;%20}';document.getElementsByTagName('head')[0].appendChild(s);}());})();


just as link to the word which when clicked must do the barrel roll will do the job for this method.

2) The second way is to have page to do a barrel roll automatically when the page is loaded.

Sumtips.com has the article carrying stuff on this regard and explains how to make a barrel roll for a select page which can seen from here

Note: with these 2 methods there is 1 more stuff in which the selected image in a particular page can be made to do a barrel roll when asked and details of doing it with an example will be on TipsNtweaks shortly.
Digg Facebook Tweet this reddit Mixx StumbleUpon Technorati Yahoo! Buzz Google Buzz Delicious BlinkList Google Bookmarks DesignFloat Diigo Blog Engage Hacker News Friend Feed Faqpal Dzone Tipd Propeller Slashdot

0 comments: on "360 degree rotation of any Web page/site"

Post a Comment
:a   :b   :c   :d   :e   :f   :g   :h   :i   :j   :k   :l   :m   :n   :o   :p   :q   :r   :s   :t