Javascript "sonsuz" sonlu içerik için kayan?

Question

Bir web sitesinde görüntülemek için çok fazla içeriğim var, böylece kullanıcı o anda yüklenen içeriğin sonuna doğru kaydırdıkça içerik yüklendiğinde "sonsuz" kaydırma çözümü kullanmam gerekiyor. Ancak, tam olarak ne kadar veri olduğunu biliyorum ve kullanıcının bunu anlamasını istiyorum. Kaydırma çubuğunun içeriğin neredeyse sonuna geldiğine benzediğini beğenmedim ve aniden daha fazla içerik yüklendi ve başparmak/kaydırıcı kaydırma parçasının ortasında ve daha dar.

Planladığım çözüm, geçerli içeriğin ardından büyük, boş, ancak daha fazla içerik yükledikçe küçültmek. Daha iyi bir fikir var mı?

Answer 1

Son çözümüm kaydırma çubuğuna sahip div içinde bir tablo oluşturmak oldu. Tablonun yüksekliğini, toplam içerik miktarının yüksekliğine ve içeriğin görüntülenmeyen kısmının yüksekliğindeki ilk sırasına ve bir sonraki sıranın şu anda bakılmakta olan içeriğe ayarlıyorum.

Daha sonra, yalnızca ekranda görünenleri veya yalnızca görünür alanın yakınında olanı çizdiğiniz yan kaydırma video oyunlarında kullanılana benzer bir işlem kullandım. Kullanıcının nereye gittiğini takip etmek için yol noktalarını kullandım ve sonra da görünen içeriği yeniledim ve kullanıcıyı görüntüledikleri noktaya göre tutmak için jquery scrollto işlevini kullandım. Bu nedenle, herhangi bir noktada, sadece bir sayfa değerindeki içerik geçerli görüntüleme alanının üstünde veya altında "görüntülenir".

Tüm "içerik" öğelerinin aslında istemcinin sisteminde olduğunu ve bu nedenle indirmenin sorun olmadığını unutmayın. Benim için sorun, "içerik" i tek seferde hepsini ele almaya çalışırsam, istemcinin sistemini yavaşlatmaktan vazgeçen devasa bir DOM yapısıdır. Bu yüzden sadece bir parçasını oluşturabilir ve görüntüleyebilirim.

Bu, kaydırma çubuğunu içeriğin altına çekip sürüklemeye karar verirseniz, ekranın yenilenmesi ve kötüye kullanımdan dolayı bir miktar daralmaya neden olur. Daha iyi bir şey bulursam, bunu güncellerim.http://0xdabbad00.com/2012/11/25/icebuddha-scrolling-javascript-infinite-scrolling-in-a-finite-area/ şimdi bu adays için fişin bir ton vardır

Answer 2

Bir UI öğesi tasarladığınızda, sormak zorunda olduğunuz ilk şey, son kullanıcının gerçekte ne yaşamalarını istediğinizdir. Çözümünüz, henüz orada olmayan bir ton veri gibi görünmesini sağlayacaktır (ve daha eski/arşiv öğeleri kullanıcının ilgisini çekmeyebilirse). Bu, içeriği okumaktan tamamen vazgeçebilir çünkü çok uzun görünüyor.

Sorun, genişleyen içeriği desteklemek için kaydırma çubuğu olarak tasarlanmamıştır. İşaret ettiğin gibi, bu içerik için aldatıcı.

Eğer arşiv verilerini indirirseniz

mevcut yüksüz verinin uzunluğu, ayrı belirtmek isteyebilirsiniz Sen tam BİLGİLERİ

1. yüklenen verilerin uzunluğunu sağlayan tamamen yeni bir kaydırma özelliği tasarım olabilir hangi bölümünün Yüklenen verinin mevcut değeri

Neyin yüklü olduğunu ve ne olduğunu belirten yeşil bir arka plana sahip renkli bir kaydırma çubuğu, neyin yüklü olduğunu, ancak eski verilerin ne olduğunu gösteren sarı bir bölüm ve kullanıcı olarak nelerin indirilebileceğini gösteren kırmızı bir bölüm scr olls oldukça iyi olurdu.

Answer 3

Maksimal belgenizin sonuna kadar göze çarpan bir karakter ekleyebilirsiniz (örneğin 15k piksel olarak), böylece kaydırma çubuğu sayfanızın derinliğini tam olarak yansıtıyorsa, demek istediğinizi belirtin. Böyle bir şey…

document.write('<div style="Position:Absolute; Left:0px; Top:15000px;";>.</div>');