Basit bir sayfa efecti

Web Tasarımı - Basit bir sayfa efecti ...

Cevapla
Basit bir sayfa efecti
gin isimli Üye şimdilik offline konumundadır

gin

Webmaster / İstanbul

Standart

Basit bir sayfa efecti

Alt 24-05-2011 #1
Sponsorlu Bağlantılar

Sayfanın belli bir bölgesine linkleme yapabildiğimiz NamedAnchor'ları biraz daha efecktli bir şekilde kullanmak daha estetik olduğu düşüncesindeyim.Umarım birilerinin işine yarar.




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ginn Efects(006)</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function
goToByScroll(id){$('html,body').animate({scrollTop :
$("#"+id).offset().top},'100');
}
</script>
<style>
.container{
width:900px;
height:auto;
margin-left:auto;
margin-right:auto;
}

#menu{
width:900px;
height:40px;
line-height:40px;
text-align:center;
font-family:Verdana;
}

#Item1{
width:900px;
height:400px;
border:solid 1px #000;
background: #CCC;
}
#Item2{
width:900px;
height:400px;
border:solid 1px #000;
background: #999;
}
#Item3{
width:900px;
height:400px;
border:solid 1px #000;
background: #666;
}
</style>
</head>

<body>
<a name="top" id="top"></a>
<div class="container">
<div id="menu">
<a href="#anchor1" onclick="goToByScroll('anchor1')">Item1</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a href="#anchor2" onclick="goToByScroll('anchor2')">Item2</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a href="#anchor3" onclick="goToByScroll('anchor3')">Item3</a>
</div>
<a name="anchor1" id="anchor1"></a>
<div id="Item1"></div>
<a name="anchor2" id="anchor2"></a><a href="#top" onclick="goToByScroll('top')">Yukarı</a>
<div id="Item2"></div>
<a name="anchor3" id="anchor3"></a><a href="#top" onclick="goToByScroll('top')">Yukarı</a>
<div id="Item3"></div>
</div>
</body>
</html>
Bu mesajdan alıntı yap
Sponsor Links

Grafikerler.net Reklamları

Cevapla

Benzer Konular
Konu Konu Bilgileri Forum Cevaplar Son Mesaj
Photoshop Dersleri: Foto Efecti αÐØηîS Photoshop Dersleri 5 18-05-2012 13:00:21
Göz Efecti Furkan EKMEN Deneme Çalışmalar 2 27-11-2010 15:14:27
Plotterla Kesme Efecti Golge-2 Web Tasarımı 0 12-11-2010 09:04:08
bu efecti nasıl yapıyolar dj_barış Photoshop Soru ve Sorunlarınız 1 29-03-2010 08:51:33
hız efecti pearlyy Photoshop Soru ve Sorunlarınız 2 02-10-2009 09:14:21

Kapat
Şifremi Unuttum?