Herhangi bir kategori linkine tıklandığında web sayfası yenilenmeden aynı sayfa içine tıklamış olduğunuz linki çağırmaya yarayan bir uygulama. Bir çoğumuz bu özelliği ilk önce Facebook sitesinde görmüştür. Zaten Facebook ne yapıyorsa ardından benzer uygulamalar da çıkıyor yavaş yavaş. Bir aralar çok aramama rağmen bir türlü bulamadığım bir özellikti benim için. Chris Polis tarafınan yapılan Pagify.js ile çok kolay bir şekilde bu özelliğe sahip sayfalar hazırlayabilirsiniz. Html ile kaydedilmiş olan dosyaları sunucuya attıktan sonra menü ile bunları çağırmanız yeterli. Tıklamış olduğunuz linkler ile alakalı olan dosya page_holder divi içinde açılıyorlar.
Kullanım
- Head etiketleri arasına eklenmesi gereken bölümler.
Js dosya adresleri :
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script src="../pagify.js" type="text/javascript"></script>JavaScript :
<script type='text/javascript'>
$(document).ready(function() {
$('#page_holder').pagify({
pages: ['about', 'usage', 'options'],
animation: 'fadeIn',
'default': 'about',
cache: true
});
});
</script>
- Body etiketleri arasına eklenmesi gereken bölüm.
<div id='container'> <header><nav> <a href='#about'>About</a> <a href='#usage'>Usage</a> <a href='#options'>Options</a> <a href='https://www.mintik.com'>Mintik</a> </nav> </header> <div id='page_holder' /> </div>
natanael paylaşımı altında 3 fikir paylaşıldı.