2011-06-07 14 views
5

में टेक्स्ट घुमाएं क्या क्षैतिज से ऊर्ध्वाधर तक पाठ घुमाने के लिए कोई क्रॉस-ब्राउज़र विधि है?एचटीएमएल

मुझे ग्राफ में एक लेबल जोड़ने की आवश्यकता है। बेशक मैं एक छवि का उपयोग कर सकता था लेकिन इससे पहले कि मैंने सोचा कि मैंने सोचा था कि मैं अन्य विकल्पों के बारे में पूछूंगा।

धन्यवाद

+0

यहां उम्मीद है कि सांता को वह उपहार मिलेगा जो वह हम सभी के साथ साझा कर सकता है! – n8wrl

+1

हम किस क्रॉस ब्राउज़र के बारे में बात कर रहे हैं? –

+0

केवल नए स्कूल ब्राउज़र या इंटरनेट एक्सप्लोरर 6-8 सहित? – Tronic

उत्तर

2

केवल बात मैं के बारे में सोच सकते हैं एसवीजी का एक छोटा सा है।

RaphaelJS स्पष्ट रूप से इस तरह की चीज को अच्छी तरह से क्रॉस-ब्राउज़र तरीके से संभालता है।

राफेल वर्तमान में फ़ायरफ़ॉक्स 3.0+, सफारी 3.0+, क्रोम 5.0+, ओपेरा 9.5+ और इंटरनेट एक्सप्लोरर 6.0+ का समर्थन करता है।

उनके spinning text example देखें।

+1

प्रति jQuery नहीं, लेकिन यह कुछ है। –

+0

हाँ, मेरी इच्छा है कि यह jQuery के साथ था ... – santa

+0

@ सांता - [क्यों?] (Http://en.wikipedia.org/wiki/Golden_hammer) –

0

यदि आप साइट स्थिर हैं तो मैं आपको छवियां बनाने का सुझाव देता हूं, और यदि आप कुछ प्रोग्रामिंग भाषा का उपयोग php जैसे करते हैं तो आपको फ्लाई पर छवियों में अपना टेक्स्ट बदलने के लिए लाइब्रेरी का उपयोग करना चाहिए।

0

कैनवास के लिए थोड़ा प्यार कैसे करें?

<!DOCTYPE html> 
<html> 
    <body> 
     <canvas id="myCanvas" height="100px" width="20px"></canvas> 
     <script> 
      var canvas = document.getElementById("myCanvas"); 
      var context = canvas.getContext("2d"); 
      var text = "Hello, World!"; 
      context.rotate(Math.PI/2); 
      context.fillText(text, 10, 0); 
     </script> 
    </body> 
</html> 

अधिक यहाँ जानकारी: http://www.html5canvastutorials.com/

(। पर ओएस एक्स शेर क्रोम 18, फ़ायरफ़ॉक्स 11, और सफारी 5 के साथ परीक्षण किया गया)

+0

बाजार के नेता को छोड़कर सभी प्रमुख ब्राउज़रों पर परीक्षण किया गया? :-) –

0

कैसे एसवीजी के लिए एक छोटे से प्यार के बारे में?

<!DOCTYPE html> 
<html> 
    <body> 
     <svg xmlns="http://www.w3.org/2000/svg" mlns:xlink="http://www.w3.org/1999/xlink"> 
      <text x="10" y="50" transform="rotate(90 20 30)">Hello, World!</text> 
     </svg> 
    </body> 
</html>