jQuery/जावास्क्रिप्ट में एक छवि फसल और पुनर्विक्रेता (एक ही समय में) स्क्रैच से कोड?

Question

हम एक साधारण जावास्क्रिप्ट (jQuery) छवि फसल & पुनर्विक्रेता कोडिंग कर रहे हैं। असल में, अभी के लिए, केवल सुविधाओं की आवश्यकता है फसल और का आकार बदलें।

मैं JCrop आदि जैसे कुछ jQuery प्लगइन्स की जाँच की है और यह कोई एक ही समय में दोनों काम करने प्लगइन्स है लगता है। फसल के बहुत सारे या पुनर्विक्रेता, लेकिन एक ही समय में एक ही "प्राकृतिक" छवि दृश्य पर दो विशेषताएं नहीं हैं। प्राकृतिक से मेरा मतलब है कि यह (नीचे सही) की तरह उदाहरण नेत्रहीन उपयोगकर्ताओं के लिए बहुत अच्छा नहीं कर रहे हैं:

http://jsfiddle.net/opherv/74Jep/33/

हालांकि मुझे लगता है कि यह एक ही समय में दो सुविधाओं के लिए जाने के लिए एक संभव तरीका होगा। आप देख सकते हैं हालांकि यह उदाहरण केवल भी वर्तमान में ज़ूम और यह लेखक खुद से "बदसूरत हैक्स" का उपयोग कर ऐसा करने के लिए के रूप में योग्य है: हम नहीं बल्कि संभावना एक काटने वाला फ्रेम का उपयोग करने के लिए देख रहे हैं

function changeZoom(percent){ 
    var minWidth=viewport.width(); 
    var newWidth= (orgWidth-minWidth)*percent/100+minWidth; 
    var newHeight= newWidth/orgRatio; 
    var oldSize=[img.width(),img.height()]; 

    img.css({ width: newWidth+"px", height: newHeight+"px" }); 

    adjustDimensions(); 

    //ugly hack :(
    if (img.offset().left+img.width()>dragcontainer.offset().left+dragcontainer.width()){ 
     img.css({ left: dragcontainer.width()-img.width() +"px" }); 
    } 
    if (img.offset().top+img.height()>dragcontainer.offset().top+dragcontainer.height()){ 
     img.css({ top: dragcontainer.height()-img.height() +"px" }); 
    } 
} 

/जोन (जैसा कि हम अक्सर वेब पर देखते हैं) + छवि पर ज़ूम/डी-ज़ूम विकल्प (उदाहरण के लिए छवि की सीमा पर हैंडल)

चूंकि हमें केवल उन दो विशेषताओं की आवश्यकता है, जिन्हें हमने सोचा था कि हम करेंगे इसे स्क्रैच से कोड करें या लगभग हम अन्य जावास्क्रिप्ट फ़ाइलों/प्लगइन्स को जोड़ना नहीं चाहते हैं जो किसी भी तरह से अन्य सुविधाओं के साथ पैक किए जा रहे हैं जिन्हें हमें आवश्यकता नहीं होगी (कम से कम अभी के लिए)। वहाँ-बड़े आकार का फिर से सीधा हैंडल & एक फ्रेम/क्षेत्र के चयन में (जो भी फिर से बड़े आकार का हो जाएगा अपने आप ही और से croppable द्वारा एक छवि के प्रदर्शन कोड करने के लिए कोशिश कर रहा है पर एक विशिष्ट कठिनाई है:

सवाल यह है कि इतने उपयोगकर्ता के आस-पास खींचने योग्य छवि को उस छवि के किस हिस्से को ट्यून कर सकते हैं)?

क्या हम निश्चित रूप से दो सुविधाओं को अलग करना बेहतर कर रहे हैं?

आपकी मदद के लिए बहुत बहुत धन्यवाद।

Answer 1

इस प्लगइन का प्रयास किया ??

http://code.google.com/p/resize-crop/

यह दोनों फसल और आकार बदलने