Animatsiyaliq obektler jaratiw.
Tayanısh tu’sinikler: Animatsiya, kadrlar (frames), simvollar (symbols), qatlamlar (layers), waqıt sızıg’ı(timeline).
Ha’zirgi kunde Web-saytlardı ko’rgizbeli, qızıg’arlı etip jaratıwda Macromedia Flash programmasının’ ornı bo’lek. Bul programma ja’rdeminde ha’r qıylı ha’reketleniwshi obektlerdi, videokliplar, dawıslı animatsiyalar, interaktiv obektlerden ibarat bolg’an multfilmlar jaratıwımız mu’mkin. Keyingi waqıtlarda Flash MX programması en’ tanıqlı interaktiv programmalardan birine aylandı. Onın’ ja’rdeminde tek g’ana animatsiya jaratıw menen sheklenip qalmay qosımsha quramalı dinamikalıq interaktiv programmalardın’ mag’lıwmatlar bazasın ha’m duziw mu’mkin. Ha’zirgi kunde Flashdan paydalanıwshılar sanı kunnen kunge ko’beyip atır. Son’g’ı mag’lıwmatlar boyınsha Flashdan paydalanıwshılar sanı 580 millionnan asıp ketti. Flash xaqıyqatındada ha’m multimedialı programmalar
arasında en’ effektiv programma bolıp, onı multimedialı ha’m ha’r qıylı oyınlı programmalar qatarında ushıratıw mu’mkin. Sol sebepli Flash en’ belgili interaktiv programmalardın’ biri bolıp tabıladı.
En’ con’g’ı shıqqan Flash MX modeli Macromedia kompaniyasının’ en’ jaqsı maxsulatı esaplanadı. Flash texnologiyası Evropa ha’m Amerikanın’ ha’r qıylı elektron proektlerinde qatnasqan. Mısalı, Ullı Britaniyanın’ Kerb kompaniyası multfilminin’ 1-bo’limin Web-dizaynın Flash texnologiyası ja’rdeminde isledi.
Flash programmasında islengen filmde grafikalıq obektler menen bir qatarda tekstli obektler menen ha’m islesiwge boladı. Macromedіa Flash programması filmg’a tekstli element qoyıp, onın’ qasiyetlerin beriwge ha’m o’zgertiwge mu’mkinshilik beredi.
Flash programmasında xujjetke basqa programma obektlerin jaylastırıwg’a da boladı. Sol sebepli kesteler yaki basqa sızılmalardı qaytadan sızıp otırıwdın’ qajeti joq. Tekst o’lshemin, stilin, formasın o’zgertiw ha’m mu’mkin.
Flash programmasında jaratılg’an obektlerdi bayıtatug’ın bul dawıs. Flash da dawıslı obektler jaratıw ushın dawıslı informatsiyanın qasiyetlerin uyrenip alıw kerek, sonda Flash de jaratılg’an filmler professional bolıp shıg’adı.
Flash programmasının’ tiykarg’ı jumıs maydanları ha’m tusinikleri
Macromedia Flash programması ja’rdeminde animatsiyalı prezentatsiyalar jaratıwımız mu’mkin. Prezentatsiyag’a tayar animatsiya obektlerin qoyıw mu’mkinshiliklerin beretug’ın Microsoft tın’ Power Point programmasına qarag’anda Macromedia Flash programmasında jaratılg’an obektler tolıg’ı menen siz ta’repten jaratıladı ha’m animatsiyag’a aylantırıladı. Sonın’ menen birge programmada aktiv elementler menen islesiw imkaniyatları da bar. Macromedia Flash programmasında kishi animatsiya faylları (kliplar), Internet betleri, elektron qollanbalar tayarlaw mu’mkin. Bunday fayllar o’zinin’ originallıg’ı ha’m islesiw an’satlıg’ı, jaratıw tezligi ha’m ko’lemi ko’p bolmawı menen ajıralıp tu’radı.
Da’slep bazı bir bazalıq tusiniklerdi anıqlap alayıq. Bul tusiniklerge kadrlar (frames), simvollar (symbols), qatlamlar (layers) ha’m waqıt sızıg’ı, shkalası (timeline) kiredi.
Timeline qatarı
Timeline (waqıt sızıg’ı, waqıt shkalası) Flash programmasında animatsiyalar menen islesiwdegi en’ tiykarg’ı a’sbap bolıp tabıladı. Onda qatlamlar xaqqındag’ı mag’lıwmatlar, qanday kadrlar gilt kadrlar ekenligi h.t.b. xaqqında mag’lıwmatlar sa’wlelenedi. Waqıt shkalası ja’rdeminde qaysı kadrlar ha’reket yamasa metkalardan (belkilerden) tu’ratug’ınlıg’ın tusiniwge boladı. Ol gilt kadrlardı ha’m
animatsiyalardın’ putin bir bo’legii jaylastırıwg’a mu’mkinshilik beredi. Jaqsı sho’lkemlestirilgen ha’m qolıylı interfeys arqalı bul a’sbaptı tez arada u’yrenip alıwg’a boladı. Waqıt shkalasının’ geybir elementlerin ta’riypleyik
• Marker – aynada suwretleniwshi ag’ımdag’ı kadrlardı ko’rsetedi, qanday da bir kadrdı shaqırg’anımızda marker og’an avtomat tu’rde jaylastırıladı.
• Qatlamlar – shep ta’repte qatlamlar dizimi bar bolıp, onın’ astında qatlamlardı qosıwg’a ha’m alıp taslawg’a mu’mkinshilikler beriwshi knopkalar (tu’ymeler) boladı.
• Kadrlar shkalası - a’piwayı ha’m gilt kadrlardı qosıwg’a ha’m o’shirip taslawg’a mu’mkinshilik beretug’ın maydan. Eger qandayda bir kadrda kontekstli menyudi shaqırsan’ız, onda a’melge asırıw mu’mkin bolg’an ha’reketler dizimin ko’riwgen boladı. SHkalada gilt kadrlar bolıp esaplanatug’ın kadrlar xaqqında mag’lıwmatlar sa’wlelenedi, bunday kadrlar qara do’ngelekler menen belgilenedi. Onda ha’reketler (do’ngeleklerdin’ u’stinde «a» ha’ribi ) yamasa metkalardan (qızıl bayraqshadan son’ metkalar atı shıg’adı). Ren’ine qarap kadrlar tu’rin de anıqlawg’a boladı.
Sur ren’ – gilt kadrı (keyframe). Ko’kshil yamasa jasıllaw ren’ - bul kadrdın’ Flash te generirlengenligin bildiredi. Aq yaki «bos» ken’islik – bul kadrda hesh na’rse joq ekenligin bildiredi.
• Sayalardı basqarıw tu’ymeleri – bul shkala qon’sılas kadrlardı anıq ko’riw ushın arnalg’an ha’m bunda aldıng’ı ha’m keyingi kadrlar aralıg’ı ayırmashılıq anıq ko’rinip tu’radı. Programma a’dettegidey Windows bas menyuinin’ PUSK tu’ymeshesin PROGRAMMI bo’liminde basıw menen iske tu’siriledi, onda Macromedia programmaları toparınan Macromedia Flash buyrıg’ın tan’laymız. Na’tiyjede ekranda to’mendegi ayna payda boladı.
Programmanın’ tag’ı bir tiykarg’ı jumıs maydanlarınan biri bul jumıs quralları bo’limi. Onın’ ja’rdeminde biz har qıylı grafikalıq formalardı jaratıwımız ha’m olar ustinde ha’r tu’rli a’meller orınlawımızg’a boladı. Bul bo’limde jumıs qurallarının’ astında sızıqlar ren’in ha’m arqa ren’in o’zgertiw mu’mkin. Ha’r bir jumıs quralı o’zinin’ mu’mkinshiliklerine, ko’rinisine, rejimine ha’m qasiyetlerine iye. Mısalı, ren’di forma ishine beriwde tolıq shegaralang’an forma, tolıq sheklenbegen forma ha’m pu’tkilley sheklenbegen forma rejiminde islew mu’mkin.
Jumıs quralları (ja’rdemshi tu’ymesheler) menyui
- V – forma yaki maydandı tan’law ha’m onı kadr boylap ha’reketlendiriw.
- A – Kadrda tan’lang’an forma shegaraların o’zgertiw.
-N-Kadrda sızıqsha tu’rdegi forma sızıw.
- L -Kadrda lasso ja’rdeminde qalegen maydanımızdı tan’law(a’jayıp tayaqsha ha’m ko’pmuyesh lasso rejimleride bar)
- P – Kadrg’a ko’pmuyesh tu’rdegi forma sızıw.
-T– Kadrg’a tekst elementlerin qosıw.
-O– Kadrg’a shen’ber tu’rdegi forma sızıw.
- R – Kadrg’a to’rtmuyesh tu’rdegi forma sızıw.
- Y – Kadrg’a qalem ja’rdeminde forma sızıw (sızılg’an forma shegaraların o’zgertiw ha’m mu’mkin).
- B – Kadrg’a shetka ja’rdeminde forma sızıw (sızıq tu’ri, shetka qalınlıg’ı ha’m formasın tan’lap alıwımız mu’mkin)
-Q – Kadrda tan’lang’an formanı sozıw (formanı aylandırıw, sozıw, kishireytiw, shegaraların o’zgertiw rejimi ha’m bar)
- F–Kadrda tanlang’an forma ren’inin’ o’zgeriw jo’nelisin beriw.
- S–Kadrda tan’lang’an forma shegaralarının’ ren’in o’zgertiw
- K–Kadrda tanlang’an forma arqa ren’in o’zgertiw (tolıq shegaralang’an forma, tolıq shegaralanbag’an forma ha’m putkilley sheklenbegen forma arqa ren’in o’zgertiw rejimleri de bar)
-I–Kadrda isletilgen ren’di qaytadan tan’law.
- E – Kadrda qalegen maydandı o’shirgish ja’rdeminde o’shiriw (shegara, arqa ren’ ha’m qalegen tan’lag’an ren’imiz, o’shirgish qalınlıg’ın, a’jayıp o’shirgish tu’rin o’zgertiw ha’m mu’mkin).
- H –Kadrdı jıljıtıw.
-Z–Kadr masshtabın o’zgertiw (ulkeytiw yaki kishireytiw mu’mkin)
Sızıqlar ren’in ha’m arqa ren’in o’zgertiw maydanshaların tan’lag’anımızda to’mendegi dialog aynaları payda boladı.
Onın’ ja’rdeminde yaki ren’ kodı arqalı, yamasa 256 ren’nen tan’lap alıp, yaki spektrdan ren’ tan’lap alıwımız, ren’ beriw jolın tan’lawımız mu’mkin. Ren’di basqa jol menen o’zgertiw mu’mkin. Onın’ ushın Okno menyusindegi TSvetovoy nabor (Ctrl+F9) ha’m TSvetovoy mikser (Shift+F9) buyrıqların iske tusiremiz.
Qatlam (Layer - Sloy) – gey bir grafika redaktorlarınday Flash programmasında ha’m qatlamlardan paydalanamız. Qaysı qatlam joqarıda jaylasqan bolsa sol qatlam obektleri basqa obektlerdin’ ustinde ko’rinip tu’radı. Qatlamdı ko’rinbeytug’ın yaki o’zgerip tu’ratug’ın qılıw ha’m mu’mkin. Qatlamlar a’piwayı ha’reket traektoriya qatlamı yaki maska (payda bolıw) qatlam ko’rinisinde bolıwı mu’mkin. A’dette ha’r qıylı ha’reketler ushın ha’r qıylı qatlamlar jaratıw kerek boladı.
Kadr (Frame - Kadr) - Flash ha’m geypara animatsiya redaktorlarında ha’m video montaj programmalar tiykarında kadrlar izbe izligi qollanıladı. Kadrdı siz o’zin’iz sızıp jaratıwın’ız yaki programma onı avtomatik tu’rde jaratıwı mu’mkin. Kadrlar bir neshe tu’rde boladı. Basqarıw kadrı (keyframe - klyuchevoy kadr) tusinigi ha’reket traektoriyasının’ nuqtaların belgileydi. Avtomatik tu’rde
jaratılg’an kadrlar bolsa eki tu’rde boladı: formalar geometriyasının’ o’zgeriwi (shape tweening) yaki basqarıw kadrlar o’zgeriwi (motion tweening) tiykarında jaratılg’an kadrlar.
Qatlamlar (Sloi)
Kompyuter grafikasında bud a’sbap jiyı ushırasadı. Mısalı, eki ta’repinde ko’rinip tu’ratug’ın tınıq bette suwret salayıq ha’m olardı bir-birinin’ ustine qoyayıq. Bunda joqarg’ı qatlamdag’ı bar na’rseler to’mendegi qatlamdag’ılardın’ ustine tusedi. Qatlamlardı ko’rinbes etip qoyıwg’a’ boladı.
Flash programmasında qatlamlardın’ eki ayrıqsha tu’ri bar: ha’reket traektoriyasınan tu’rıwshı qatlamlar ha’m maska-qatlamlar
Kadrlar
Animatsiya kadrlar izbe izliginen tu’radı. Kompyuter animatsiyasında gilt kadrlar (keyframe) tusinigi bar bolıp, bul kadrlardı Flash programması animatsiya duziw protsessinde o’zgerte almaydı. Bul gilt kadrlardı biz beremiz, al olardın’ arasına aralıq kadrlardı Flash o’zi ornatadı. Aralıq kadrlardın’ eki tu’ri bar bolıp, birinshisi geometriyalıq o’zgeriwi tiykarında duzilgen (shape tweening) kadrlar yamasa
simvollar o’zgeriwi tiykarında duzilgen (motion tweening) kadrlar. Ekinshisi – bos kadrlar, yag’nıy hesh na’rsege iye bolmag’an kadrlar.
Kadrlar u’stinde a’meller
Bos gilt kadrlardı ornatıw
–Insert–Blankkeyframe, F7 Aldın’gı kadrlardın’ mazmunın qaytalawshı gilt kadr
-Insert –keyframe, F6 Gilt kadrdı tazalaw
-Insert–Clear keyframe, Shift+F6 Kadr ornatıw
-Insert–Frame, F5 Kadrdı alıp taslaw
-Insert-Remove Frames, Shift+F5
Kadrlardı izbe-iz du’ziw animatsiyası
Bul animatsiya tolıg’ı menen gilt kadrlarınan tu’radı, yag’nıy kadrdın’ mazmunın ha’m onın’ «dawamlılıg’ın» biz o’zimiz belgileymiz. Bul tu’rdegi animatsiyanın’ jetiskenliklerine to’mendegiler kiredi:
• Kadrlardı izbe iz duziw animatsiya paydalanıwshıg’a animatsiya ustinen ulken kontrol ornatıwg’a mu’mkinshilik beredi. Eger siz ta’jiriybeli animator bolsan’ız, onda bul usıldan jaqsı paydalanıwın’ızg’a boladı.
• Bul putkilley g’arezsiz qorinislerdin’ o’zgeriw rejimin sho’lkemlestiriwshinin’ birden bir usılı – slayd shou. Bul usıldın’ kemshiliklerine to’mendegiler jatadı:
• Kadrdı izbe iz duziw animatsiyanı modifikatsiya qılıw qıyın bolıp a’sirese eger ol ko’rinislerdin’ diskret jınag’ı emes, al baylanıslı animatsiya bolsa, barlıq kadrlardı modifikatsiyalawg’a tuwrı keledi
• Kadrlardı izbe iz duziw animatsiyası jude ulken qolemdi iyeleydi ha’m ha’r bir kadr xaqqındag’I mag’lıwmatlardı saqlap qoyıwg’a tuwrı keledi.
Aralıq kadrlardı du’ziw animatsiyası
Bul usılda Flash animatsiyası berilgen gilt kadrlar arasında aralıq kadrdı avtomatik tu’rde ornatadı. Bul na’rse siz obektti salasız, son’ basqa bir kadrlarda o’zgerisler kiritesiz ha’m Flash programmasınan usı 2 gilt kadrlar arasında jatıwshı kadrlardı salıp shıgıwdı soraysız degendi an’latadı. Animatsiya tezligin sizin’ Flash filmin’izdin’ (Movie) tezligine ha’m ha’reketke keltiriwshi kadrlardın’ sanına g’arezli boladı. Modify-Movie – bul jerde Frame Rate parametri sekundına kadrlardın’ sanın beredi. Sapalı animatsiya ushın aralıq tezligi sekundına 25-30 kadrlardan kem bolmawı kerek.
Endi “Web betlerde animaciya jaratiw” temasinda islengen animaciyalarimdi ko’rsetemen:
Islengen animaciya kodi:
Islengen animaciyanin’ ko’rinisi:
Islengen animaciya kodi:
Islengen animaciya ko’rinisi:
Islengen animaciya kodi:
Islegen animaciya ko’rinisi:
Islengen animaciya kodi:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Advanced demo: Quyash Sistemasi</title>
<meta charset="utf-8">
<link rel="stylesheet" href="default.css">
<link rel="canonical" href="/css-pseudo-element-solar-system/demo/">
<!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<script>
var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-7489188-1']); _gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.async = true; ga.src = 'http://www.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<header>
<hgroup>
<h1>QUYASH SISTEMASI</h1>
</hgroup>
</header>
<ul id="solarsystem">
<li id="sun" itemscope>
<h2 itemprop="object">Quyash</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">The Sun is a star, a hot ball of glowing gases at the heart of our solar system. Its influence extends far beyond the orbits of distant Neptune and Pluto. Without the Sun's intense energy and heat, there would be no life on Earth. And though it is special to us, there are billions of stars like our Sun scattered across the Milky Way galaxy. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Sun">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">1,392,000 <abbr title="kilometers">km</abbr></dd>
</dl>
</li>
<li id="mercury" itemscope>
<h2 itemprop="object">Merkuriy</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Sun-scorched Mercury is only slightly larger than Earth's Moon. Like the Moon, Mercury has very little atmosphere to stop impacts and it is covered with craters. Mercury's dayside is super heated by the Sun, but at night temperatures drop hundreds of degrees below freezing. Ice may even exist in craters. Mercury's egg-shaped orbit takes it around the Sun every 88 days. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Mercury">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">4,876 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">57×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">88<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="venus" itemscope>
<h2 itemprop="object">Venera</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Venus is a dim world of intense heat and volcanic activity. Similar in structure and size to Earth, Venus' thick, toxic atmosphere traps heat in a runaway 'greenhouse effect.' The scorched world has temperatures hot enough to melt lead. Glimpses below the clouds reveal volcanoes and deformed mountains. Venus spins slowly in the opposite direction of most planets. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Venus">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">12,107 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">107×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">224<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="earth" itemscope>
<h2 itemprop="object">Jer</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Earth is an ocean planet. Our home world's abundance of water - and life - makes it unique in our solar system. Other planets, plus a few moons, have ice, atmospheres, seasons and even weather, but only on Earth does the whole complicated mix come together in a way that encourages life - and lots of it. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Earth">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">12,755 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">150×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">365<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="mars" itemscope>
<h2 itemprop="object">Mars</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Though details of Mars' surface are difficult to see from Earth, telescope observations show seasonally changing features and white patches at the poles. For decades, people speculated that bright and dark areas on Mars were patches of vegetation, that Mars could be a likely place for life-forms, and that water might exist in the polar caps. When the Mariner 4 spacecraft flew by Mars in 1965, many were shocked to see photographs of a bleak, cratered surface. Mars seemed to be a dead planet. Later missions, however, have shown that Mars is a complex member of the solar system and holds many mysteries yet to be solved. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Mars">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">6,794 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">229×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">687<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="asteroids" itemscope>
<h2 itemprop="object">Asteroids & Meteorids</h2>
</li>
<li id="jupiter" itemscope>
<h2 itemprop="object">Yupiter</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">The most massive planet in our solar system, with four large moons and many smaller moons, Jupiter forms a kind of miniature solar system. Jupiter resembles a star in composition. In fact, if it had been about 80 times more massive, it would have become a star rather than a planet. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Jupiter">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">142,983 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">777×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">4,333<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="saturn" itemscope>
<h2 itemprop="object">Saturn</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Saturn was the most distant of the five planets known to the ancients. Like Jupiter, Saturn is made mostly of hydrogen and helium. Its volume is 755 times greater than that of Earth. Winds in the upper atmosphere reach 500 meters (1,600 feet) per second in the equatorial region. These super-fast winds, combined with heat rising from within the planet's interior, cause the yellow and gold bands visible in the atmosphere. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Saturn">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">120,536 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">1,429×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">10,759<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="uranus" itemscope>
<h2 itemprop="object">Uran</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">The first planet found with the aid of a telescope, Uranus was discovered in 1781 by astronomer William Herschel. The seventh planet from the Sun is so distant that it takes 84 years to complete one orbit. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Uranus">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">51,117 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">2,871×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">30,684<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="neptune" itemscope>
<h2 itemprop="object">Neptun</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Nearly 4.5 billion kilometers (2.8 billion miles) from the Sun, Neptune orbits the Sun once every 165 years. It is invisible to the naked eye because of its extreme distance from Earth. Interestingly, the unusual elliptical orbit of the dwarf planet Pluto brings Pluto inside Neptune's orbit for a 20-year period out of every 248 Earth years. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Neptune">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">49,527 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">4,496 ×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">60,190<abbr title=" days">d</abbr></dd>
</dl>
</li>
<li id="pluto" itemscope>
<h2 itemprop="object">Pluton</h2>
<dl>
<dt>Description</dt>
<dd itemprop="description">Tiny, cold and incredibly distant, Pluto was discovered in 1930 and long considered to be the ninth planet. But after the discoveries of similar intriguing worlds even farther out, Pluto was reclassified as a dwarf planet. This new class of worlds may offer some of the best evidence of the origins of our solar system. <a href="http://solarsystem.nasa.gov/planets/profile.cfm?Object=Pluto">Source: NASA</a></dd>
<dt>Diameter</dt>
<dd itemprop="diameter">2,390 <abbr title="kilometers">km</abbr></dd>
<dt>Distance from sun</dt>
<dd itemprop="distance">5,869 ×10<sup>6</sup> <abbr title="kilometers">km</abbr></dd>
<dt>Orbital period</dt>
<dd itemprop="orbit">90,465<abbr title=" days">d</abbr></dd>
</dl>
</li>
</ul>
</body> </html>
Islengen animaciya ko’rinisi:
