İmleçler ve işaretçiler

Dokunmatik ekranı olmayan cihazlarda imleç, kullanıcılarınızın neyle etkileşimde bulunduğunu bilmesi için önemli bir yöntemdir. Ayrıca, bir öğeyle nasıl etkileşim kurulabileceği veya dokunmatik yüzey ya da fareyle yapılan bir hareketin sitenizi nasıl etkileyeceği hakkında faydalı ipuçları da verebilirsiniz.

İmleçler

Tarayıcılar, imleçlerle ilgili bazı yaygın kullanım alanlarını otomatik olarak işler.

Bu sayfayı imleçli bir cihazda okuyorsanız sayfayı inceleyin. İmleçlerin daha önce nasıl değiştiğini fark etmemiş olabilirsiniz ancak sağladığı ipuçlarına dikkat edin. İşaretçiniz metnin üzerine geldiğinde imleç, metni seçebileceğinizi belirten bir seçim I-kirişine dönüşür. Bir bağlantının üzerine geldiğinizde imleç, işaret parmağıyla işaret eden bir ele dönüşür. Bu, bir işlem yapabileceğinizi gösterir. llamado.

Daha fazla etkileşimli site oluşturdukça, kullanıcıların etkileşimleri daha kolay anlaması için imleci özelleştirmek isteyebilirsiniz.

Tarayıcılar, sürükleme, yeniden boyutlandırma, seçim ve daha fazlası için ipuçları sağlayan imleç özelliği ile ilgili bir dizi anahtar kelimeyi destekler.

Desteklenen imleçlerden hiçbiri bir öğenin etkileşimlerini iletmiyorsa imleç olarak kullanılacak bir SVG veya PNG resmi de sağlayabilirsiniz.

Düzeltme işaretleri

Düzenlenebilir metindeki konumunuzu göstermek için ekleme işareti kullanılır. Bu, farenizi takip etmediği için imlecinizden farklıdır. Rengi caret-color ile değiştirebilirsiniz.

Kullanıcının işaretçi girişlerine yanıt verme

Fare veya dokunmatik alan kullananlar, dokunmatik ekran kullananlara kıyasla ekranda daha hassas bir noktayla etkileşimde bulunabilir. Yalnızca fare hassasiyetine göre tasarım yaparsanız dokunmatik ekranı olan veya ince motor becerileriyle ilgili sorunlar yaşayan kullanıcılar, sayfanızla istedikleri gibi etkileşimde bulunamayabilir.

Genel sorunlar arasında çok küçük düğmeler veya birbirine çok yakın etkileşimli öğeler yer alır. Bu durum, kullanıcıların doğru öğeyle etkileşim kurmasını zorlaştırır.

Düğmelerinizin ve diğer etkileşimli hedeflerinizin yeterince büyük olmasını sağlamak, sitenizin erişilebilir olmasını sağlamak için önemli bir adımdır. Ayrıca, pointer ve any-pointer medya sorgularıyla stillerinizi kullanıcının giriş cihazlarının hassasiyetine göre özelleştirebilirsiniz.

pointer medya özelliği, kullanıcının birincil giriş cihazını ifade ederken any-pointer tüm giriş cihazlarını ifade eder. Fare gibi cihazları fine ile, dokunmatik ekran gibi cihazları ise coarse ile eşleştirebilirsiniz. none değeri, kullanıcının işaretçili bir giriş cihazı kullanmadığını gösterir.

İşaretçi ve dokunma etkinlikleri

Belirli dokunmatik ekran hareketlerini devre dışı bırakma

Dokunmatik ekran kullanırken tarayıcı, bazı yaygın hareketleri işler. Örneğin, ekrana iki parmağınızla dokunup parmaklarınızı birbirinden uzaklaştırdığınızda genellikle site yakınlaştırılır. Bu davranışları sitenizde uygulamanız gerekmez ancak belirli durumlarda bu davranışı devre dışı bırakmak veya geçersiz kılmak isteyebilirsiniz.

Tarayıcının bazı işlemleri yapmasını devre dışı bırakmak için öğenin yapmasını istediğiniz işlemleri listeleyin. pan-x ve pan-y, tek parmakla kaydırma hareketlerini etkinleştirir. Bu özellikler, çok parmakla yakınlaştırma ve kaydırma işlemlerini sağlayan pinch-zoom ile birlikte etkinleştirilebilir.

manipulation anahtar kelimesi pan-x pan-y pinch-zoom ile eşdeğerdir. manipulation, yakınlaştırmak için iki kez dokunma gibi kısa sürede birden fazla dokunma gerektiren diğer dokunma davranışlarını hariç tutar.

Bir işlemi touch-action dışında bırakarak tarayıcının bu işlemi işlemesini devre dışı bıraktıktan sonra, bu işlem için işaretçi etkinlikleri ayarlayabilirsiniz.

Tüm etkinlikleri ve işlemleri devre dışı bırakma

Bazı durumlarda, bir öğenin etkileşimli olmadığını belirtmek isteyebilirsiniz. Örneğin, bir düğmede pointer-events: none ayarını yaptığınızda düğmeyi tıklayamaz veya fareyle üzerine gelme durumunu tetikleyemezsiniz.

Anlayıp anlamadığınızı kontrol etme