来源:flash,as,js兴趣爱好者

纯HTML5代码做的太阳系效果（没用js,只用html5标签）    
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
    <svg width='100%' height='100%' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' >
    <rect x='0' y='0' width='100%' height='100%' fill='black' />
    <!-- Sun Color -->
    <radialGradient id='rg' cx='50%' cy='50%' r='100%' >
    <stop stop-color='red'       offset='0%'   stop-opacity='1' />
    <stop stop-color='yellow'  offset='50%'  stop-opacity='1' />
    <stop stop-color='white'    offset='100%' stop-opacity='1' />
    </radialGradient>
    <!-- Astroid's Path 3 -->
    <path id='path3' d='M700,300 h 0 a900,200 0 1,0 1,1 z' fill='none' stroke='black' stroke-width='1' />
    <circle cx='0' cy='0' r='1.5' fill='white' >
    <animateMotion dur='8s' fill='freeze' repeatCount='indefinite' >
    <mpath xlink:href='#path3' />
    </animateMotion>
    </circle>
    <!-- Defines Moon's Path 2 around Earth -->
    <defs> 
    <g id='E' transform='translate(-340,-90)'>
    <circle cx='347' cy='87' r='10' fill='blue' /> 
    <!-- Earth -->
    <path id='path_moon' d='M390,80 h 0 a50,19 0 1,0 1,1 z'  fill='none' stroke='red' stroke-width='1' />
    <circle cx='0' cy='0' r='5' fill='white' stroke='black' stroke-width='1' >
    <!-- Moon -->
    <animateMotion dur='28s' fill='freeze' repeatCount='indefinite' >     
    <mpath xlink:href='#path_moon' />
    </animateMotion >
    </circle>
    </g>
    </defs>
    <!--水星-->
    <defs> 
    <g id='water' transform='translate(-100,-30)'>
    <circle cx='100' cy='30' r='5' fill='#804000' />
    </g>
    </defs>
    <!--水星-->
    <!--金星-->
    <defs> 
    <g id='gold' transform='translate(-150,-45)'>
    <circle cx='150' cy='45' r='7' fill='white' />
    </g>
    </defs>
    <!--金星-->
    <!--火星-->
    <defs> 
    <g id='fire' transform='translate(-300,-90)'>
    <circle cx='300' cy='90' r='4' fill='red' />
    </g>
    </defs>
    <!--火星-->
    <!--木星-->
    <defs> 
    <g id='wood' transform='translate(-500,-135)'>
    <circle cx='500' cy='135' r='25' fill='url(#wood_col)' />
    </g>
    </defs>
    <radialGradient id='wood_col' cx='50%' cy='0%' r='100%' >
    <stop stop-color='#CCCC99'       offset='0%'   stop-opacity='1' />
    <stop stop-color='#804000'  offset='30%'  stop-opacity='1' />
    <stop stop-color='#CCCC99'  offset='40%'  stop-opacity='1' />
    <stop stop-color='#CCCC99'    offset='60%' stop-opacity='1' />
    <stop stop-color='#804000'    offset='70%' stop-opacity='1' />
    <stop stop-color='#CCCC99'    offset='100%' stop-opacity='1' />
    </radialGradient>
    
    <!--木星-->
    <!--土星-->
    <defs> 
    <g id='Saturn' transform='translate(-700,-190)'>
    <circle cx='700' cy='190' r='20' fill='url(#Saturn_col)' />
    </g>
    </defs>
    <radialGradient id='Saturn_col' cx='50%' cy='50%' r='50%' >
    <stop stop-color='#FFFF6F' offset='0%'   stop-opacity='1' />
    <stop stop-color='#FFFF6F' offset='30%'  stop-opacity='1' />
    <stop stop-color='#CCCC99' offset='100%'  stop-opacity='1' />
    </radialGradient>
    <!--土星-->
    <!--天王星-->
    <defs> 
    <g id='sky' transform='translate(-900,-255)'>
    <circle cx='900' cy='255' r='6' fill='skyblue' />
    </g>
    </defs>
    <!--天王星-->