Nautilus

Alvaro Montoro tarafından jQuery için geliştirilmiş bir  eklenti. Eklenti orta kısmı  yazı olarak kesilmiş bir  resmin arka planında  bir  akvaryum görüntüsü  sağlıyor. Hareketli  sular hareketli balıklar adeta  3D  gibi.

Kullanım

  • Head  etiketleri arasına eklenecek olan bölümler.

jQuery ve eklenti url  adresleri :

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.nautilus.js"></script>

Css :

<style type="text/css">
		html, body {
			background-color: #ccc;
		}
		#verne {
			top: 100px;
			left: 100px;
		}
		.sub_ctrl {
			position: absolute;
		}
		.ctrlUp {
			top:30px;
			left:40px;
		}
		.ctrlDown {
			top:60px;
			left:40px;
		}
		.ctrlLeft {
			top:45px;
			left:5px;
		}
		.ctrlRight {
			top:45px;
			right:5px;
		}
		</style>

JavaScript : 

<script type="text/javascript">
			$(document).ready(function() {
				$("#verne").nautilus({
					controls:true,
					color: '#ffffff',
					controlsWidth:100,
					controlsType: 'image',
					controlsUp: "up.jpg",
					controlsDown: "down.jpg",
					controlsLeft: "left.jpg",
					controlsRight: "right.jpg",
				});
			});
</script>
  • Body etiketleri arasına eklenecek olan kısım.

Html :

<div id="verne">
			<img src="alvaro.png" class="window" style="width:500px;height:200px;" />
			<img src="waves2.png" class="waves"  style="width:1000px;height:300px;top:40px;" />
			<img src="waves1.png" class="waves"  style="width:1000px;height:300px;top:30px;" />
			<img src="layer1.png" style="width:700px;height:1000px;" />
			<img src="layer2.png" style="width:700px;height:1000px;" />
			<img src="layer3.png" style="width:700px;height:1000px;" />
			<img src="layer4.png" class="moves"  style="width:200px;height:150px;top:300px;" />
			<img src="fondo.jpg"  class="back"   style="width:700px;height:1000px;"/>
</div>

 

Bu Yazıyı Paylaş

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

ÜYE GİRİŞİ

Arkadaş ekleme, özel mesaj, kişisel yazı paylaşmak için siteye giriş yapın

Şifremi unuttum? Kayıt Ol!
  • Ali:

    Pardon Yuyyu olacaktı...

  • Ali:

    Tamam yuyu da olsun :)...

  • Arkadaşlık Uygulaması:

    Yuyyu Online Arkadaşlık Sitesi – Sohbet Et ve Yeni İnsanlarla Tanış Yuy...

  • Ali:

    Üşenmeden web arşivi linkini arayıp bulmuşsun teşekkürler :)...

  • ibrahim:

    türkiyeden de bırakan olmuş oyunu. dünya geneli de bırakan epey olmuş. wi...

  • Araç çubuğuna atla