Kategoriler
Kodlama

Sayfadaki linkleri pasif yapmak

Bazen bir html sayfadaki linklerin olmasını ama çalışmamasını istersiniz. İşte jQuery veya CSS ile çözümler.

Sayfadaki linklerden bazılarının çalışmasını istemiyorsanız aşağıdaki jQuery ve CSS ile yapmış olduğum örneklerden birini kullanabilirsiniz. Bu yöntem önyüzde bazen kullanıcıların tıklamaması istenen ama görünen şeyler için kullanılabilir.

Sayfa içerisinde <a href=""> linklerinin bazılarının çalışmamasını neden istersiniz?

  1. İlgili element bir JavaScript komutu içerisindedir ve tıklandığında başka bir şeyin çalışması gerekir, ayrıca linkin arama motorları tarafından okunmasını da istersiniz.
  2. Basit olduğu için, backend kodlamaya girmeden sabir bazı linklere bu işi uygulayabilirsiniz.
  3. Çünkü yapılabiliyor.

İlk yöntem jQuery:

$('.icindeki a').click(function(e){
	$('.icindeki a').attr('href','javascript:void(0);');
});

Yukarıdaki örnek .icindeki class içerisindeki a linki ne olursa olsun href javascript:void(0); değiştirerek etkisiz hale getiriyor.

İkinci yöntem CSS:

.icindeki a{
  pointer-events: none;
}

CSS yöntemi sadece tıklamayı değil fare ile yapılabilecek her şeyi iptal ediyor, buna scroll, mause sitili, vs. vs. Bu yüzden bira dikkatli kullanmak lazım. Örneğin CSS’de bir iframe için pointer-events:none; atarsanız o iframe içerisindeki fare hareketleri de çalışmayacaktır.

Canlı örnek: https://jsfiddle.net/wolkanca/otbmzqes/3/

Umarım işinize yarar, bu yöntemlerle sayfada ek değişiklikler gerekmeden işleri hızlı halledebilirsiniz.