JQuery मोबाइल पिंच ज़ूम छवि केवल

Question

मेरे पास एक काम कर रहे जेक्यूएम एप्लिकेशन है जिसमें मैं कुछ छवियां प्रदर्शित करना चाहता हूं। वर्तमान में छवियां अपने स्वयं के आईफ्रेम में हैं ताकि उन्हें ऐप से अलग से स्क्रॉल किया जा सके।

मैं केवल आईफ्रेम के भीतर छवियों को ज़ूम करने में सक्षम होना चाहता हूं।

मुझे एहसास है कि मैं निम्नलिखित कोड स्निपेट को समायोजित करता हूं कि मैं चुटकी ज़ूम सक्षम कर सकता हूं लेकिन यह पूरे एप्लिकेशन के लिए सक्षम है।

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> 

अधिकतम-स्केल पिंच ज़ूम रिटर्न को हटाकर लेकिन सब कुछ के लिए।

क्या कोई छवि के लिए चुटकी ज़ूम सक्षम करने का कोई तरीका है? Iframe पर नया व्यूपोर्ट टैग जोड़ने के बारे में, क्या यह काम करेगा यदि यह भी संभव है?

अद्यतन

• iframe में HTML इंजेक्शन। मेटा टैग जोड़ा गया, इससे मदद नहीं मिली।

• कोशिश की गई .extend ($। Mobile.zoom, {locked: false, सक्षम: true}); iframe शरीर पर, यह कुछ भी नहीं किया।

Answer 1

यह चाइल्डब्रोसर प्लगइन का उपयोग करने का सबसे अच्छा तरीका है। आईओएस और एंड्रॉइड पर यह छवियों के लिए सही काम करता है।

आईओएस Childbrowser:

https://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/ChildBrowser 

एंड्रॉयड ChildBrowser:

https://github.com/phonegap/phonegap-plugins/tree/master/Android/ChildBrowser 

फिर एक बार आप सभी सेटअप आप यूआरएल या इस तरह स्थानीय फ़ाइलें खोल सकते हैं किया है:

window.plugins.childBrowser.onLocationChange(location); 

Do ध्यान दें कि आईओएस और एंड्रॉइड के बीच पूरी तरह से क्रॉस प्लेटफ़ॉर्म सेटअप में उन्हें दोनों को अलग-अलग संस्करण की आवश्यकता होती है प्लगइन के एनएस। आईओएस को डेडिस रीडी में चाइल्डब्रोसर इनिट की आवश्यकता है, एंड्रॉइड नहीं है।

Answer 2

एक (हैक) समाधान के रूप में शायद आप जब उपयोगकर्ता एक चुटकी gesture प्रदर्शन कर रहा है पता लगा सकते हैं, तो एक CSS transform का उपयोग कर छवि ज़ूम।

Answer 3

आप छवि पर ऐसा कर सकते हैं:

var image=document.getElementById('imageId'); 

image.addEventListener('gesturechange',function(e){ 

    if(e.scale>1){ 
     //zoom in 
     //increase the size of image according to the e.scale 
    } 

    else if(e.scale<1){ 
     //zoom out 
     //decrease the size of image according to the e.scale 
    } 
}); 

Answer 4

विजेट किसी तरह का उपयोग कर सकते हैं/बाहर छवि inplace काम में ज़ूम करने के लिए? जैसे: http://0.s3.envato.com/files/78471334/index.html
https://github.com/timmywil/jquery.panzoom