Erhan Yakut Software Developer @Binalyze | Founder @Passwall | Golang Enthusiast | Open Sorcerer

Websitede Sağ Tuşu ve Seçme (Highlight) İşlemini Engelleme

54 sec read

CSS jQuery Html



Websitelerinin tasarımı ve sitede kullanılan teknolojiler oldukça önemlidir. Ancak esas değerli olan şey içeriktir ki artık herkes bunu kabul ediyor. Durum böyle olunca içeriğimizi korumak için çeşitli tedbirlere başvuruyoruz. Bu tedbirlerden en yaygın olanları ise sitedeki içeriğin kopyalanmasının önüne geçmek için farenin sağ tuşu ile sitede işaretlemeyi engelleme. Eskiden bunun için kodlarla taklalar atmamız gerekirken artık bu çok basit.

Sağ Tuş Engelleme

Websitemizde sağ tuş ile kes/kopyala işlemlerini engellemek için aşağıdaki jQuery kodundan faydalanabilirsiniz.

$(document).ready(function(){
   $(document).bind("contextmenu",function(e){
      return false;
   });
});

Sitede İşaretlemeyi (Highlight) Engelleme

Sağ tuşu engelledik diyelim ancak hala sol tuş ile metinler seçilebilir ve Ctrl+C (CMD+C) ile kopyalama işlemi yapılabilir. İşte bunun önüne geçebilmek için de sitede işaretlemenin engellenmesi gerekir. Bunu yaparken de günümüz CSS teknolojisinden faydalanacağız. Bu işlem için sitenizin CSS dosyasının en başına şu satırları eklemeniz yeterli.

html {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

Not: Yukarıdaki kod sitenin tamamında işaretlemeyi engeller. Fakat bazen sitenin tamamında değil de sadece belirli bir öğesinde seçimi engellemek isteriz. İşte böyle bir durumda html etiketi yerine seçimini engellemek istediğiniz CSS seçicisine (mesela .content veya .post) yukarıdaki kodları eklerseniz sorununuz çözülür ;)



Erhan Yakut Software Developer @Binalyze | Founder @Passwall | Golang Enthusiast | Open Sorcerer