12 Kasım 2014 Çarşamba

Sayfa Yenilenmeden Link Değiştirme

Html5 ile gelen bir özellik olan location.hash sayesinde artık sayfa yenilenmeden linkimizi değiştirebiliyoruz. bende bugün nasıl değiştireceğimizden bahsetmek istiyorum.


Kodlarımız:


[html]


<!DOCTYPE html>
<html>
<head>
<title>Html5 ile sayfa yenilenmeden link değiştirme </title>
<meta charset="utf-8">
<meta name="description" content="" />
<meta name="keyword" content="" />
<meta name="author" content="Vehbi Akdogan" />
<script src="js/jquery.min.js?v=1.0"></script>
<script type="text/javascript">

$(function(){

$("ul.menu li a").click(function(){
var hash = $(this).attr("href"); // adresi aldık
location.hash = hash; // adres çubuğumuzu değiştirdik
$(".hash").html("mevcut adres: " + hash); // ekrana gösterdik

return false;
});



});
</script>

<style type="text/css">
ul.menu li {
float:left;border:1px solid #ddd;
padding:5px 15px;
margin-lefT:5px;
list-style:none;
}
ul.menu li a {
display:block;
width:100%;
height:100%;
text-align:center;
text-decoration:none;
color:#555;
}
.hash {
clear: both;
margin-top:20px;
width:100%;
color:#555;
displaY:block;
}
</style>

</head>
<body>

<ul class="menu">
<li> <a href="anasayfa.html">Anasayfa</a></li>
<li> <a href="hakkimizda.html">Hakkımızda</a></li>
<li> <a href="iletisim.html">İletişim</a></li>
</ul>
<div class="hash"></div>

</body>
</html>






[/html]




Demo
Yayınlayan: Unknown

Sayfa Yenilenmeden Link Değiştirme

vehbi akdogan - kişisel blog sitesi
Share:

Yorum Yaz ..

Facebook
Blogger

Hiç yorum yok:

Yorum Gönder

Sosyal Aglarda Ben :)
facebook
twitter
google
youtube
rss

About Us

İstatistik

Iletisim

Ad

E-posta *

Mesaj *

© Vehbi Akdogan - Kişisel Blog Sitesi | Tüm Hakları Saklıdır.