Có thể có 3-4 CSS trên một trang hay không và sau đó trên bất kỳ sự kiện nào, hãy nhấp vào, thay đổi css cho toàn bộ trang web. Bằng cách này, chúng tôi có thể cung cấp cho người dùng khả năng thay đổi chủ đề. Tôi biết chúng tôi có thể thay đổi css của một phần tử theo:Làm cách nào để thay đổi CSS của toàn bộ trang/trang web khi nhấp?
$("#myElementID").removeClass("class1").addClass("class2");
Có, điều đó là có thể. Thông thường, những gì bạn sẽ làm là viết một hàm JavaScript sẽ thay đổi hoặc thêm hoặc xóa một tờ định kiểu khỏi tài liệu <head> của tài liệu. Để làm cho trải nghiệm tốt hơn một chút, bạn thường sẽ lưu trữ tùy chọn của người dùng trong cookie. Có một số article on A List Apart that show how to implement this.
Và tất nhiên, you can do this with jQuery ... bạn có thể muốn kiểm tra nguồn của jStyler.
The CSS Zen Garden (xem câu hỏi thứ năm) đã kết thúc quyết định rằng cách dễ nhất là chỉ để làm mới trang và thiết lập một phía máy chủ CSS mới.
Nhưng tôi muốn làm bên @client này, tôi có nghĩa là sử dụng jQuery hoặc javascript –
CSS được emdeded để DOM qua thẻ 'liên kết', vì vậy bạn có thể xác định vị trí liên kết này và thêm/xóa
Tiếp theo mã cho thấy làm thế nào để loại bỏ và thêm mới (Tôi đang sử dụng MS AJAX thấy phương pháp $ được nhưng bạn có thể thay thế nó bằng DOM tinh khiết hoặc phương ngữ khác):
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);
không xóa và thêm 'link rel =" stylesheet "' sẽ làm điều này? không chắc chắn, nhưng tôi sẽ phải cung cấp cho nó một thử –
@ Rakesh Juyal bạn có nghĩa là dự phòng của loại/id/charset? Nếu như vậy thì bộ ký tự thực sự là thừa, nhưng loại được khuyến nghị mạnh mẽ bởi một số trình duyệt (Có thể tôi sai về loại, nhưng IE cần nó). Cuối cùng 'id' là cần thiết bởi logic kịch bản lệnh. – Dewfy
thường tốt nhất để tải một stylesheet bên ngoài (nối thêm một liên kết < >): http://snipplr.com/view/3873/failsafe-load-for-attaching-stylesheet/
nhưng nếu bạn cần để tạo ra một loạt các phong cách trên bay, bạn cũng có thể xây dựng và nối thêm một phong cách < > nút để DOM: http://jonraasch.com/blog/javascript-style-node
này có vẻ đầy hứa hẹn :) 1 –
Xem plguin jStyler cho jQuery , nguồn khá ngắn và dễ hiểu. –