Mobil  cihazlar üzerinden internet  kullanımı  gün geçtikçe artıyor. Hal böyleyken website  sahipleri de mobil cihazlarda kullanımı  kolay temalar kullanmak zorunda kalıyor. Resim ve videoların dahi tarayıcıya  duyarlı  (responsive) olabilmesi  için geliştirilen birçok örnek var. jQuery Naver eklentisi de Ben Plum tarafından bu amaçla  hazırlanmış bir jQuery  eklentisidir.

Naver ile Html5 nav elementi ile oluşturulan site menülerini  çok kolay bir şekilde  tarayıcıya duyarlı (responsive) hale getirebilirsiniz. Norma bir masaüstü cihazda tam boy  görünen menü  mobil cihazlar üzerinden  açıldığında  sadece kategori ikonu görünür. Navigasyon menüler için geliştirilmiş olan Naver uygulamasını denemek için mobil cihaz kullanmanız gerekmiyor. Normal bir bilgisayar kullanarak ta uygulamanın  nasıl çalıştığını görebilirsiniz.

Demo sayfasını açtığınızda kullanım hakkında basit  aşamaları geçtikten sonra  tanıtım  amaçlı  hazırlanmış basit navigasyon menü örneklerini görebilirsiniz. Tarayıcınızı küçülttüğünüz  anda menü kaybolacak ve sadece kategori ikonu görünecektir. Kategori ikonunu  tıkladığınızda kaybolmuş olan menü butonları alt alta  sıralanmış bir şekilde açılacaktır.

 Kullanım

• Head etiketleri arasına eklemeniz gereken bölümler.

Js ve Css dosya adresleri :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://www.benplum.com/lab/_Formstone/Naver/jquery.fs.naver.css" type="text/css" media="all" />
<script src="http://www.benplum.com/lab/_Formstone/Naver/jquery.fs.naver.js"></script>

 JavaScript :

$("nav").naver({
    animated: true
});

• Body etiketleri arasına eklemeniz gereken bölüm.

Html :

<nav>
    <a href="#">Home</a>
    <a href="#">About</a>
    <a href="#">Contact</a>
</nav>