केंद्र और घुमाएँ IE8 (jQueryRotate) के साथ छवि

Question

सभी,

मैं एक तरह से केंद्र और एक बटन क्लिक करने पर एक छवि को घुमाने के लिए की तलाश में हूँ। मैं jQueryRotate लाइब्रेरी का उपयोग कर रहा हूँ।

यहां दृष्टिकोण है जिस पर मैं विचार कर रहा था।

http://jsfiddle.net/HatAndBeard/k3Gxj/6/

यह क्रोम/फ़ायरफ़ॉक्स में ठीक नहीं बल्कि IE8 में या उससे पहले काम करता है। कुछ छवि कलाकृतियों हैं जिन्हें मैं छुटकारा नहीं पा सकता हूं। कोई विचार?

पीएस घूर्णन कैसे किया जाता है, इसके लिए मेरे पास सख्त आवश्यकता नहीं है, इसलिए अन्य दृष्टिकोण भी आपका स्वागत है।

पीएसएस। यदि JSFiddle लिंक आपकी पसंद के अनुसार नहीं हैं तो मैं कोड पोस्ट कर सकता हूं।

Answer 1

हाय इस प्लगइन का एक लेखक im और मैं एक प्लगइन :)

के मुखपृष्ठ पर इस प्लगइन के बारे में टिप्पणी और मुद्दों में से किसी का स्वागत करते हैं

क्या आप अपनी समस्या को थोड़ा और समझा सकते हैं, क्योंकि मैं आईई 8 में आईई 8 या आईई 7 में अनुकरण करने के लिए इसे प्राप्त नहीं कर सकता। यह भी मुद्दा बनाना अच्छा होगा :)

मैंने देखा कि केवल "अजीब" समस्या सिर्फ एक लोडिंग छवि प्रभाव है जिसे आप अपने पृष्ठ को लोड करने के बाद आसानी से छुटकारा पा सकते हैं, तो आप केवल $ (img) .rotate (0) -> इस कर देगा यकीन है कि आप छवि पर क्लिक करें जब यह चेतन करने के लिए :)

चियर्स तैयार हो जाएगा,

Answer 2

क्या आपने इसके बजाय RaphaelJS का उपयोग करने का प्रयास किया है। इस पुस्तकालय के साथ मेरे पास अतीत में अच्छा क्रॉस ब्राउज़र अनुभव था। http://raphaeljs.com/image-rotation.html

Answer 3

मैं IE में BasicImage रोटेशन कार्यक्षमता का उपयोग करके समस्या के आसपास काम कर समाप्त हो गया: क्लिक पर राफेल साथ

छवियों घूर्णन एक आसान काम, इस डेमो पर एक नज़र है। मुझे केवल 90 डिग्री वृद्धि में छवियों को दिखाने की आवश्यकता है ताकि यह दृष्टिकोण व्यावहारिक हो।

मैं क्या किया की एक स्केच ...

function ieRotate(element, rotation) { 
      var rotationInt = 0; 
      switch (rotation % 360) { 
       case 0: 
        rotationInt = 0; 
        break; 
       case 270: 
       case -90: 
        rotationInt = 3; 
        break; 
       case 180: 
       case -180: 
        rotationInt = 2; 
        break; 
       case 90: 
       case -270: 
        rotationInt = 1; 
        break; 

      } 
      element.css('filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' + rotationInt + ')'); 
     }