Bueno primero ante todo este el primer aporte y no el ultimo que hare aqui al foro espero les sirva y agradezcan el trabajo hecho
Este es un menu circulatorio flotante que hice yo con los enlaces mas comunes de una pagina y esta hecho para que se pueda utilizar en cualquier tipo de diseño ya sea los de PWG o elaborados por ti
Asi como tambien lo puedes colocar en cualquier Pagina de tu Web Ej en el Inicio
Lo hecho con las medidas que tengo yo mas o menos en mis webs por que los cabezales de mis paginas son anchos y son diseños visualizados por una pantalla de 19 pulgadas las partes en naranja son las que se pueden modificar en altura y posicion derecha e izquierda si quieres centrala bien y lo de verde son las modificaciones habituales como enlaces y nombres y en azul el nombre de tu pagina las imagenes aqui colocadas estan subidas a mi servidor web asi q no hace falta q las vuelvan a subir
Hasta otro tutorial (aporte) y cualquier cosa me la preguntan por privado
Vista previa del Menu o cliquea la imagen para ver el resultado
Estos son los codigos
<style type="text/css"> #info {padding-bottom:100px;} #circularMenu {padding:0; margin:0 auto; list-style:none; position:absolute;left: 40%;top:130px; width:300px; height:300px; background:# url(http://img40.xooimage.com/files/6/c/3/background-de5f16.gif) no-repeat;} #circularMenu li {display:block; width:60px; height:60px; position:absolute;} #circularMenu li.home {left:120px; top:4px; background:url(https://img.webme.com/pic/r/radioaktiv24/home.png) no-repeat center center;} #circularMenu li.chat {left:200px; top:40px; background:url(https://img.webme.com/pic/r/radioaktiv24/chat.png) no-repeat center center;} #circularMenu li.comments {left:35px; top:40px; background:url(https://img.webme.com/pic/r/radioaktiv24/comments.gif) no-repeat center center;} #circularMenu li.toplist {left:230px; top:115px; background:url(https://img.webme.com/pic/r/radioaktiv24/toplist.png) no-repeat center center;} #circularMenu li.twitter {left:5px; top:115px; background:url(https://img.webme.com/pic/r/radioaktiv24/twitter.gif) no-repeat center center;} #circularMenu li.email {left:200px; top:190px; background:url(https://img.webme.com/pic/r/radioaktiv24/contact.png) no-repeat center center;} #circularMenu li.search {left:35px; top:190px; background:url(https://img.webme.com/pic/r/radioaktiv24/search.png) no-repeat center center;} #circularMenu li.facebook {left:120px; top:225px; background:url(https://img.webme.com/pic/r/radioaktiv24/facebook.png) no-repeat center center;} #circularMenu li a b {display:none;} #circularMenu li a {display:block; width:60px; height:60px; text-align:center;} #circularMenu li a:hover {background: none; text-decoration:none; font-family:Trebuchet MS;} #circularMenu li a:hover b {position:absolute; display:block; width:100px; height:100px; font-size:16px; color:#F7C707; background:#;} #circularMenu li a:hover b span {display:block; font-size:12px; color:#74FD0A; font-weight:normal; margin-top:15px;} #circularMenu li.home a:hover b {left:-22px; top:100px;} #circularMenu li.chat a:hover b {left:-102px; top:64px;} #circularMenu li.comments a:hover b {left:63px; top:64px;} #circularMenu li.toplist a:hover b {left:-132px; top:-11px;} #circularMenu li.twitter a:hover b {left:93px; top:-11px;} #circularMenu li.email a:hover b {left:-102px; top:-87px;} #circularMenu li.search a:hover b {left:63px; top:-87px;} #circularMenu li.facebook a:hover b {left:-22px; top:-121px;} </style>
<div id="circularMenu">
<ul>
<li class="home"><a href="TU URL"><b>INICIO<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="chat"><a href="TU ULR#"><b>CHAT ON LINE<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="email"><a href="TU URL"><b>CONTACTO<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="toplist"><a href="TU URL"><b>TOP LIST<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="facebook"><a href="TU URL"><b>FACEBOOK<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="search"><a href="TU URL"><b>BUSCADOR<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="twitter"><a href="TU URL"><b>TWITTER<br />
<span>THEPROJECTMASTER</span></b></a></li>
<li class="comments"><a href="TU URL"><b>LIBRO DE VISITAS<br />
<span>THEPROJECTMASTER</span></b></a></li>
</ul>
</div>
Copea los codigos con las teclas Control Y C
