jQuery Mobile Geçiş

jQuery Mobile, sayfanın açılma şeklini seçmenize olanak tanıyan CSS etkilerini içerir.

jQuery Mobile Geçiş Etkileri

jQuery Mobile, bir sayfadan diğerine geçiş yapmanın nasıl yapılacağına dair bir dizi etki sunar.

Not:Geçiş etkilerini uygulmak için tarayıcının CSS3 3D dönüşümünü desteklemesi gerekmektedir:

Tarayıcı desteği

  • Internet Explorer 10 3D dönüşümünü destekler (daha eski sürümler desteklememektedir)
  • Opera 3D dönüşümü henüz desteklemiyor

Geçiş etkileri herhangi bir bağlantıya veya data-transition özelliği ile yapılan form gönderimlerine uygulanabilir:

<a href="#anylink" data-transition="slide">Sayfa ikisine geç

data-transition özelliği ile birlikte kullanılabilir geçişleri gösteren aşağıdaki tablo:

Geçiş Açıklama Test
fade Varsayılan. Sonraki sayfaya solma-çıkma ile geç. Test
flip Arkadan öne doğru sayfayı çevirerek sonraki sayfaya geç. Test
flow Mevcut sayfayı atlayarak sonraki sayfaya geç. Test
pop Pop-up pencere gibi sonraki sayfaya geç. Test
slide Sağdan sola kaydırarak sonraki sayfaya geç. Test
slidefade Sağdan sola kaydırarak ve solma ile sonraki sayfaya geç. Test
slideup Aşağıdan yukarıya kaydırarak sonraki sayfaya geç. Test
slidedown Üstten aşağıya kaydırarak sonraki sayfaya geç. Test
turn Sonraki sayfaya geç. Test
none Geçiş etkisi yok. Test

İpucu:jQuery Mobile'de, solma-çıkma etkileri tüm bağlantılarda varsayılan olarak bulunmaktadır (tarayıcı destekliyorsa).

İpucu:Tüm bu etkiler ters eylemi de destekler, örneğin, sayfanın sağdan sola kaymasını sağlamak istiyorsanız, "reverse" değerine sahip data-direction özelliğini kullanın. Geri dönüş düğmesinde varsayılan değerdir.

Örnek

<a href="#pagetwo" data-transition="slide" data-direction="reverse">Yatay kaydır</a>

Kişisel olarak deneyin