Javascript-форум - ссылки расположенные по кругу

Здравствуйте товарищи.
Помогите пожалуйста разобраться.
Необходимо было сделать ссылки которые располагались бы по окружности. Эту задачу мне решить удалось. Но возникла небольшая загвоздка, при нажатии некоторых ссылок, выделяется другая и переход происходит именно по ней, а некоторую нажимаешь.
Я кажеться, что дело в перекрытии одного span другим, и нажимается в итоге та ссылка у которой z-index имеет наибольшее значение. Каким образом можно решить возникшую проблему?

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Текст по окружности</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript" src="jquery.lettering.js"></script>
        <script type="text/javascript" src="eliptext.js"></script>
 
        <script type="text/javascript">
            $(document).ready(function () {
            $('#curved2').elipText({radius: 112.5, dir:-1});
            $('#curved').elipText({radius: 112.5, dir:-1});
            $('#curved3').elipText({radius: 112.5, dir:-1});
            $('#curved4').elipText({radius: 112.5, dir:-1});
            });
        </script>    
 
        <style style="text/css">
*
                    {
                    padding: 0;
                    margin: 0;
                    }
.content
                    {
                    margin:auto;
                    /*text-align:center;*/
                    padding: 3px;
                    }
span
                    {
                    font: 16px/1.4 georgia, arial;
                    letter-spacing: 0;
                    }
 
#curved2
                {
                position: absolute;
                left: 60%;
                top:50%;
                z-index: 10;
                }
                 
                 
#curved
                {
                position: absolute;    
                left: 60%;
                top:50%;
                z-index: 9;
                }
                 
#curved3
                {
                position: absolute;
                 left: 60%;
                top:50%;
                z-index: 20;
                }  
                 
#curved4
                {
                position: absolute;
                 left: 60%;
                top:50%;
                z-index: 3;
                }                              
        </style>
             
</head>
      
<body>
    <div class="content">                
        <a href="http://javascript.ru"><span id="curved2">javascript.ru</span> </a>
        <a href="http://htmlbook.ru"><span id="curved">
htmlbook.ru</span> </a>
        <a href="http://site-made.ru"><span id="curved3">
site-made.ru</span> </a>
        <a href="http://technologyweb.org"><span id="curved4">
technologyweb.org</span> </a>
                </div>
     
</body>
</html>

Для корректного отображения ссылок по кругу необходимо извлечь файлы из архива. "ссылки по кругу.zip" во вложении