Sayfa yenilemeden url değiştirme

20 Eylül 2016

Merhabalar Yazılım Severler,

2012 yılında kullandığım özelliklerden biri şu dönemlerde çoğu web sitesinde popüler olmaya başladı ve bende artık kodun paylaşma vaktinin geldiğini düşündüm. Normalde çok güzel bir özellik olduğu için paylaşmak istemedim çoğu yerde paylaşılmış olmasına rağmen şahsi düşüncem gizli bir özellik olarak kalmasıydı ama artık çoğu siteler kullanmaya başladı ve popüler oldu o yüzden paylaşmak istedim neyse kodumuza geçelim.

Dediğim gibi 2012 yılında www.quuzy.com için kullandığım bir özellikti kullanımı aşağıdaki şekildedir.

if (typeof history.pushState != 'undefined') { history.pushState({module:"leave"}, document.title, 'hayati-kodla'); } 

Yukarıdaki kodu direk yapıştırınca bir işinize yaramayacaktır ama kodun temel görümü yukarıdaki gibidir. Ben sizlere bunun nasıl kullanacağınızıda göstermek istiyorum

<ul class="menu"> <li> <a href="/hayati-kodla">Hayatı Kodla</a> <a href="/hasan-yuksektepe">Hasan Yüksektepe</a> <a href="/teknodos.com">Teknodos</a> </li> </ul> 

Yukarıdaki gibi bir menü html yapımız olsun ve jquery kütüphanemizin doma eklendiğini var sayıyorum.

$(function(){ $(function(){ $('.menu li a').on('click',function(){ var link = $(this).attr('href'); var yazi = $(this).text(); if (typeof history.pushState != 'undefined') { history.pushState({module:"leave"}, yazi , link ); } }); }); 

Yukarıdaki jquery komutlarınıda doma eklerseniz menünün her bir a etiketine bastığınızda adres çubuğunun değiştiğini göreceksiniz.

Demo için Müzik Dinle buraya bakabilirsiniz.

WEB DÜNYASI İLE İLGİLİ GÜNCEL BİLGİLER İÇİN ABONE OLUN!

"Sayfa yenilemeden url değiştirme" Benzer Yazıları

Hareketli Favicon Nasıl yapılır? Heroku Proxy Oluşturma

Sayfa yenilemeden url değiştirme Etiketleri: