Oldukça havalı bir resim görüntüleyici oluşturuyorum ancak belirli bir kısımda sıkışıp kaldım: Görüntüyü yakınlaştırdığımda kaydırıyorum. Bu önemsiz bir problem gibi görünüyor ve SO ile ilgili benzer sorulara verilen cevapların tümünü denedim ama her seferinde Bir şey doğru çalışmıyor. Yeni bir göze ihtiyacım var.JQuery'yi kullanarak bir resmi kapsayıcısından nasıl daha büyük bir boyuta kaydırırım?
Geçici olarak sunucumda bir URL açtım. ,
[URL kapalı]
İleri zoom tetiklemek için Fare tekerleğinizi yukarı hareket: bu sayfaya bakın. Buradayız. Yakınlaştırıldığında, görüntüyü kaydırıp denemek için sürükleyip sürükleyin. Tamamdır, ama bir şey doğru değil.
var clicking = false;
var previousX;
var previousY;
$("#bigimage").mousedown(function(e) {
e.preventDefault();
previousX = e.clientX;
previousY = e.clientY;
clicking = true;
});
$(document).mouseup(function() {
clicking = false;
});
$("#bigimage").mousemove(function(e) {
if (clicking) {
e.preventDefault();
var directionX = (previousX - e.clientX) > 0 ? 1 : -1;
var directionY = (previousY - e.clientY) > 0 ? 1 : -1;
$("#bigimage").scrollLeft($("#bigimage").scrollLeft() + 10 * directionX);
$("#bigimage").scrollTop($("#bigimage").scrollTop() + 10 * directionY);
previousX = e.clientX;
previousY = e.clientY;
}
});
aradığım çözüm şu özelliklere sahiptir: Bu, şu anda Tarama için kullanılan koddur X ve Y ekseni üzerinde kaydırma ait
- Doğru yön
- O olmamalı mümkün
- Güzel olması kaydırma
- Oldukça akıcı görüntünün kenarlarının dışına kaydırmak için: pencere boyutlandırma herhangi bir soruna neden olmamalıdır
Aldığım herhangi bir yardımı takdir etsem de, lütfen beni genel bir eklentiye işaret etmeyin, ben de çok fazla denedim, çünkü kendi özel senaryonum için çalışan bir cevabı araştırıyorum. Çok çaresizim, yukarıdaki karakteristiği destekleyen mükemmel çözüm için para kazanacağım bile.
PS: Firefox'ta bağlantı veya Webkit tarayıcı
sen gidenin ne anlatmak ve keman verebilir misiniz? Yakınlaştırmadan, görüntünün bana göre panning ile ilgili bazı sorunları var. Daha önce senaryoyu kaydırma bir arka plan, sadece fareyi hareket ettirerek, [bu cevabı] (bkz http://stackoverflow.com/questions/7776843/mouse-on-left-of-screen-move-image-to-left oluşturduk ilham için -same-ekran-sağ-üstünde-ekran/7777153 # 7777153). –
@RobW Teşekkürler ama arka plan görüntüsü ile yaklaşım çok fazla bağımlılıkları, ben alltogether bu özelliği bırakarak düşünüyorum, her şeyin büyük bir revizyon olurdu. Kaydırma yöntemini kullanarak düzeltilebileceğini umuyordum. – Ferdy
Kemanda gördüğünüz gibi, kaydırma zor değil ve verimli bir şekilde yapılabilir. Probleminiz, kodun önceden nasıl etkili bir şekilde uygulanacağını düşünmeden yazılmasından kaynaklanıyor olabilir. Yakınlaştırma, uygun mantık ve "background-size" CSS özelliği kullanılarak kolayca yapılabilir. Ben zaten panning uygulamıştım. Her ikisini de birlikte eklemek istenen işlevsellikte sonuçlanır. İlgili bir kod sunuyorsanız, bir göz atmayı düşünebilirim. –