rounded corners

fertieg50

details
to get the best experience,[link widoczny dla zalogowanych], please use the Safari browser, chrome in the animation are point card.
rounded corners
As you can see, and now a few lines of CSS can be achieved is often a profound impression on the effect of gray.

ul.solarsystem li.sun {
????width: 40px;
????height: 40px;
????-Webkit-border-radius: 20px;
????-Moz-border-radius: 20px;
????border-radius: 20px;
}
animation and transform

ul.solarsystem li {
????-Webkit-animation-iteration-count: infinite;
????-Webkit-animation-timing-function: linear;
????-Webkit-animation-name: orbit;
}
ul.solarsystem li.earth span {
????-Webkit-animation-iteration-count: infinite;
????-Webkit-animation-timing-function: linear;
????-Webkit-animation-name: moon;
}
ul.solarsystem li.mercury {-webkit-animation-duration: 5s;}
ul.solarsystem li.venus {-webkit-animation-duration: 8s;}
ul.solarsystem li.earth {-webkit-animation-duration: 12s;}
ul.solarsystem li.earth span {-webkit-animation-duration: 2s;}
ul.solarsystem li.mars {-webkit-animation-duration: 20s;}
ul.solarsystem li.asteroids_meteorids {-webkit-animation-duration: 50s;}
ul.solarsystem li.jupiter {-webkit-animation-duration: 30s;}
ul.solarsystem li.saturn {-webkit-animation-duration: 60s;}
ul.solarsystem li.uranus {-webkit-animation-duration: 70s;}
ul.solarsystem li.neptune {-webkit-animation-duration: 100s;}
ul.solarsystem li.pluto {-webkit-animation-duration: 120s;}
@-Webkit-keyframes orbit {
from {-webkit-transform: rotate (0deg)}
to {-webkit-transform: rotate (360deg)}}

Animation and transformation features are currently only in-webkit browser,[link widoczny dla zalogowanych], effectively, the other major browsers - except IE of course - only through the border-radius rendering shows the static version of the solar system.

Oh, I admit ... ... I put Pluto stayed
ah, Internet Explorer eyes bored Qianbian our universe.
major browsers in the solar system
personal experience, I only used to complete the CSS and HTML a simple simulation of the solar system.
orbit and the planets are generated through the border-radius, while the animation is animated by-webkit animation properties and transformation capabilities to achieve. The following is an example of the code used:

thank xslidian delivery
using CSS3 rounded corners,[link widoczny dla zalogowanych], transformation and animation capabilities to draw the solar system. Interesting effect is very striking. I have studied for a few months CSS3,[link widoczny dla zalogowanych], understand the new features,followed by two police cars, and experience a degree of support for each browser. A few weeks ago I released the first experiment, on the @ font-face and transform functions. This time it,that he implanted a false U disk, I rounded rectangle conducted experiments,[link widoczny dla zalogowanych], was expecting a little bored,[link widoczny dla zalogowanych], results are very interesting.
Internet Explorer flat parallel universe:

	Forum Forum Czata Toruń wp.pl Strona Główna -> Gry	Wszystkie czasy w strefie EET (Europa)
Strona 1 z 1