2010-03-14 12 views
8

क्या किसी पृष्ठ पर 3-4 सीएसएस होना संभव है, और फिर किसी भी घटना पर, क्लिक करें, संपूर्ण वेबपृष्ठ के लिए सीएसएस बदलें। इस तरह हम अपने उपयोगकर्ता को विषय बदलने की क्षमता दे सकते हैं। मैं जानता हूँ कि हम से एक तत्व के सीएसएस बदल सकते हैं:क्लिक पर पूरे पृष्ठ/वेबसाइट के सीएसएस को कैसे बदला जाए?

$("#myElementID").removeClass("class1").addClass("class2"); 

उत्तर

9

हां, यह संभव है। आम तौर पर आप जो करना चाहते हैं वह एक जावास्क्रिप्ट फ़ंक्शन लिखता है जो दस्तावेज़ के <head> से स्टाइल शीट को बदल देगा, या जोड़ देगा या हटा देगा। अनुभव को थोड़ा बेहतर बनाने के लिए आप आमतौर पर कुकी में उपयोगकर्ता की पसंद को स्टोर करेंगे। article on A List Apart that show how to implement this है।

और बेशक, you can do this with jQuery ... आप jStyler के स्रोत को देखना चाह सकते हैं।

+0

का उपयोग कर मतलब यह होनहार :) लगता है +1 –

+0

jQuery के लिए jStyler plguin देखें , स्रोत बहुत छोटा और समझने में आसान है। –

2

The CSS Zen Garden (पांचवां प्रश्न देखें) निर्णय लेने से है कि सबसे आसान तरीका है पृष्ठ ताज़ा करें और एक नया सीएसएस सर्वर साइड सेट करने में कुछ था समाप्त हो गया।

+1

लेकिन मैं इस @client पक्ष क्या करना चाहते हैं, मैं jQuery या जावास्क्रिप्ट –

0

सीएसएस 'क्लिक' टैग से अधिक डोम को emdeded है, तो आप इस लिंक का पता लगाने और जोड़ सकते हैं/कोड के बाद

हटाने को निकालने का तरीका और नया जोड़ने (मैं उपयोग कर रहा हूँ एमएस AJAX विधि देखें $ पाने से पता चलता , लेकिन आप इसे शुद्ध डोम या अन्य बोली) के साथ की जगह ले सकता:

var head = document.getElementsByTagName('head')[0]; 

    var oldLink = $get("nameOfLink", head); 
    if(oldLink!=null) 
     head.removeChild(oldLink); //remove old entry 
    var s = document.createElement('link'); 
    s.id="nameOfLink"; 
    s.type = 'text/css'; 
    s.rel="stylesheet"; 
    s.charset ='utf-8'; 
    s.href = "http://your-provided-url"; 
    head.appendChild(s); 
+0

'लिंक rel = "स्टाइलशीट को हटा रहा है और जोड़ रहा है" यह करेगा? यकीन नहीं है, लेकिन मुझे इसे –

+0

@ राकेश जुयाल का प्रयास करना होगा जिसका मतलब है कि टाइप/आईडी/वर्णसेट की अनावश्यकता? यदि ऐसा है तो अक्षरसेट वास्तव में अनावश्यक है, लेकिन कुछ ब्राउज़रों द्वारा टाइप की दृढ़ता से अनुशंसा की जाती है (हो सकता है कि मैं दयालु हूं, लेकिन आईई को इसकी आवश्यकता है)। स्क्रिप्ट तर्क द्वारा आखिरी 'आईडी' की आवश्यकता है। – Dewfy

0

आमतौर पर सबसे अच्छा बाहरी शैलीपत्रक लोड करने के लिए (एक < लिंक >) संलग्न: http://snipplr.com/view/3873/failsafe-load-for-attaching-stylesheet/

लेकिन आप का एक समूह बनाने की जरूरत है, तो फ्लाई पर शैलियों, आप भी निर्माण और डोम के लिए एक < शैली > नोड संलग्न कर सकते हैं: http://jonraasch.com/blog/javascript-style-node