.jpg)
(hình minh họa cho sinh động )
1- style (css)
Ta bắt đầu với file css thông thường. Thường để chèn style sheet vào một trang web, ta chèn theo cú pháp như sau:
<link rel="stylesheet" type="text/css" href="style1.css" title="style1" />
Theo mặc định, trang web sẽ load style sheet trên làm style sheet
chính cho trang web. Và chỉ bị vô hiệu hoá khi có một style sheet
thay thế khác được bật lên.Để thêm một style sheet thay thế vào trang web, ta dùng cú pháp như sau:
<link rel="alternate stylesheet" type="text/css" href="styles2.css" title="styles2" />
<link rel="alternate stylesheet" type="text/css" href="styles3.css" title="styles3" />
thuộc tính rel đã được đổi thành alternate sytelsheet. Mặc định, alternate stylesheet cũng được load cùng trang web, nhưng không được bật lên (bị vô hiệu hoá). Mỗi trang web có thể có nhiều alternate stylesheet khác nhau. 2 load thư viện jquery
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="http://webvn20.googlecode.com/files/styleswitch.js"></script>
file styleswitch có thể download tại đây
Mã nguồn file styleswitch cũng được phát triển từ javascript cho nên khá ngắn gọn và dễ sử dụng
3 cách gọi file sử dụng
<a href="#style1" rel="styles1" class="styleswitch">styles1</a>
<a href="#style2" rel="styles2" class="styleswitch">styles2</a>
<a href="#style3" rel="styles3" class="styleswitch">styles3</a>
nguồn 1 và nguồn 2
No comments: