/* ================================================================
This copyright notice must be kept untouched in the stylesheet at
all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/circular.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */
#circularMenu {padding:0; margin:0 auto; list-style:none; position:relative; width:300px; height:300px; background:#fff 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(http://img22.xooimage.com/files/b/1/5/home-de5f20.gif) no-repeat center center;}
#circularMenu li.chat {left:200px; top:40px; background:url(http://img40.xooimage.com/files/5/d/0/chat-de5f30.gif) no-repeat center center;}
#circularMenu li.upload {left:35px; top:40px; background:url(http://img28.xooimage.com/files/2/6/9/photo-de5f3c.gif) no-repeat center center;}
#circularMenu li.email {left:230px; top:115px; background:url(http://img26.xooimage.com/files/b/6/c/email-de5f42.gif) no-repeat center center;}
#circularMenu li.address {left:5px; top:115px; background:url(http://img22.xooimage.com/files/f/4/0/address-de5f4c.gif) no-repeat center center;}
#circularMenu li.shop {left:200px; top:190px; background:url(http://img48.xooimage.com/files/d/7/d/shop-de5f59.gif) no-repeat center center;}
#circularMenu li.search {left:35px; top:190px; background:url(http://img48.xooimage.com/files/3/7/2/search-de5f63.gif) no-repeat center center;}
#circularMenu li.delivery {left:120px; top:225px; background:url(http://img24.xooimage.com/files/8/0/b/delivery-de5f79.gif) 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:url(http://www.cssplay.co.uk/menus/circular/circle.gif); text-decoration:none; font-family:georgia, serif;}
#circularMenu li a:hover b {position:absolute; display:block; width:100px; height:100px; font-size:16px; color:#63352c; background:#fff;}
#circularMenu li a:hover b span {display:block; font-size:12px; color:#888; 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.upload a:hover b {left:63px; top:64px;}
#circularMenu li.email a:hover b {left:-132px; top:-11px;}
#circularMenu li.address a:hover b {left:93px; top:-11px;}
#circularMenu li.shop a:hover b {left:-102px; top:-87px;}
#circularMenu li.search a:hover b {left:63px; top:-87px;}
#circularMenu li.delivery a:hover b {left:-22px; top:-121px;}
</style>
Css
Kod:
<div id="circularMenu">
<li class="home"><a href="inicio.htm"><b>Inicio<br><span>Ve Al Inicio</span></b></a></li>
<li class="chat"><a href="gracias.htm"><b>Contactame<br><span>Enviame Tus Dudas o Comentarios</span></b></a></li>
<li class="email"><a href="construccion.htm"><b>Mi Email<br><span>Enviame Correos</span></b></a></li>
<li class="shop"><a href="construccion.htm"><b>Lo Nuevo<br><span>Encuentra Lo Nuevo De la Web</span></b></a></li>
<li class="delivery"><a href="afiliados.htm"><b>Afiliados<br><span>Web Amigas</span></b></a></li>
<li class="search"><a href="gracias.htm"><b>Afiliate!!<br><span>Te Gustaria Estar En Mi Web?</span></b></a></li>
<li class="address"><a href="http://www.paginawebgratis.es"><b>Pagina Web Gratis<br><span>Te Gustaria Una Web Como Esta?</span></b></a></li>
Çerezler küçük bilgi verici metinlerdir, bizim veya iş ortaklarımızın tarayıcınız aracılığıyla size ulaşmamızı sağlar.
Tarayıcınızdaki ayarları değiştirerek istediğiniz zaman çerez kullanımını engelleyebilirsiniz.
Genel Veri Koruma Yönetmeliği ile uyumlu aşağıdaki çerezleri kullanıyoruz:
- Temel çerezler: Web sitesinin tam olarak işlevsel olması için kesinlikle gereklidir.
- Opsiyonel Çerezler: İsteğe bağlı çerezlerdir ve web sitesini geliştirmemize yardımcı olur, ör. sizi kişisel olarak tanımlamadan web sitesindeki kullanım davranışınızın analiz edilmesi gibi.
Gizlilik politikamızdan daha fazla bilgiye ulaşabilirsiniz.