HTMLの各種要素を立体的に回転させるjQuery、
jquery-vortexを紹介します。

↓以下が実際のソースサンプルです。

▼JavaScript

<script src="./js/jquery.min.js"></script>
<script src='./js/jquery.vortex.js'></script>
<script>
$(window).load(function() {
  $('#vortex').vortex({
    initialPosition: 270,
    speed: 500
  });
});
</script>

▼HTML

<h1>Vortex のリンクサンプルです。</h1>
<p>それぞれの円をリンクにしています。</p>
<div id="vortex">
	<div class="link_box" id="red"><a href="#">1</a></div>
	<div class="link_box" id="blue"><a href="#">2</a></div>
	<div class="link_box" id="yellow"><a href="#">3</a></div>
	<div class="link_box" id="green"><a href="#">4</a></div>
	<div class="link_box" id="orange"><a href="#">5</a></div>
</div>

▼CSS

#vortex {
  width: 600px;
  height: 300px;
  position: relative;
	margin:100px 300px;
}
.link_box {
  width: 50px;
  height: 50px;
  border: solid 2px black;
  border-radius: 50px;
	text-align:center;
  position:relative;
}
.link_box a {
	  position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-999px;
}
#red{
	background-color:red;
}
#blue{
	background-color:blue;
}
#yellow{
	background-color:yellow;
}
#green{
	background-color:green;
}
#orange{
	background-color:orange;
}

今回、参考にさせていただいたのは、
『monteiz/jquery-vortex　-github-』さんです。
ありがとうございます。

デモページは、こちら