Làm tuyết rơi trên nền Blog

Làm tuyết rơi trên nền Blog
Từ sau khi làm xong theme Xmas, có một số bạn hỏi về Code làm cho tuyết rơi trên nền Blog (kết hợp cả tuyết và ảnh nền riêng). Vì thế hôm nay mình cũng share cái Code này cho các bạn (mặc dù có chú thích trong CSS của theme Xmas, bạn nào đọc file CSS đó là thấy thôi )

Đây là cách làm :


1 - Làm tuyết rơi trên nền Blog :





Các bạn dùng Code sau nhé :


Code:

#head{background:transparent url(http://files.myopera.com/Dephia/nendong/snow.gif) center bottom;}
#bd{background:transparent url(http://files.myopera.com/Dephia/nendong/snow.gif) center bottom;}

2 - Thay tuyết rơi bằng các nền động khác :

Ngoài tuyết, ta có thể thay bằng các ảnh có nền trong suốt khác, như mưa, lá rơi .... bằng Code sau, chỉ cần thay link ảnh vào thôi :


Code:

#head{background:transparent url(Link ảnh) center bottom;}
#bd{background:transparent url(Link Ảnh) center bottom;}

Đây là một số ảnh nền trong suốt có hiệu ứng : (Click chuột phải vào ảnh và chọn Copy Shorcut hoặc Copy Image Location để lấy link nhé !)






Tuy nhiên, chỉ nên dùng các ảnh đơn giản thôi, ko nên dùng ảnh quá phức tạp, sẽ làm rối Blog lắm ^^

Code này các bạn dùng Theme kiểu 2 mảnh ko nên dùng nhé !!!

(Bản quyền bài viết thuộc về W.Dephia's Blog - dephia.tk, vui lòng ghi rõ nếu sử dụng lại nhé !)

Chương 1: Kỹ thuật, code CSS

Thêm blog vào công cụ tìm kiếm Google
Bảng mã màu cho Yahoo Plus
Code hình nền cho các Module (CSS)
CSS là gì? - Cách chèn css vào Blog Plus
Dùng CSS thay đổi hình nền trong Yahoo!360 Plus
Hướng dẫn upload hình và cách lấy link hình
Ý nghĩa 1 số Code CSS cho việc thiết kế theme

Chương 2: Trang Trí

Hiệu ứng Blink (Nhấp nháy) và 1 số tùy chỉnh cho chữ và link
Hiệu ứng cho Avatar của Friendlist Module !!!
Hình động ( icon ) ngộ nghĩnh nè!!!!
Làm tuyết, mưa rơi trên nền Blog
Một số thủ thuật trình bày bài viết
Tạo chú mèo ảo chạy nhảy trên blog và ... đuổi chuột
Tạo một con Thú ảo trên blog và tương tác được với nó nè
Thiết kế Module Profile ấn tượng

Chương 3: Làm mới

Cách làm trong suốt Yahoo 360 Plus
Hướng dẫn tự làm & [Share] icon cho Module tâm trạng !!
Border (đường viền) cho các Module
Button Homepage cho Yahoo Plus
Thay đổi con trỏ trên blog theo ý mình
Thay đổi Icon biểu thị cho New comment,Thư mục riêng và Bài mới !
Thay đổi Icon cho Module Tâm Trạng !
Thay đổi màu chữ và link tại một số Module trong blog
Thay đổi nền comment cho mỗi entry !
Thay nền cho "bình Luận Nhanh " - Module mới update
Thiết kế đường viền cho Yahoo 360 Plus
Trang trí cho Yahoo 306 Plus - Kho ảnh động
Trang trí cho Yahoo 306 Plus - Kho hình nền
Trang trí cho Yahoo 306 Plus - Text and Animation

Chương 4: Module tự tạo

Module tạo bảo đồ theo dõi người truy cập Blog
Module tự tạo - Chèn đồng hồ
Thêm biểu tượng ngăn dòng cho Module Bài Viết !
Chèn game flash vô Yahoo Plus
Flickriver - Module Flickr (album hình ảnh) cho Plus
Hướng dẫn tạo List nhạc và đưa nhạc lên Y!Plus

sao minh khon glam duoc nhi?

Có thể trình duyệt của bạn chưa cài adobe flash player ! Thử cài và chạy lại xem sao nhé !

Xin phép được Post lại bài viết vì tình hình là 1 số link ảnh trong bài viết trên đã không còn dùng được nữa:

Code:

/* Đoạn code này làm cho hình trái tim xuất hiện khi chuột rê vào các link trên toàn blog*/a:hover {text-decoration:none; color:#D570EE; text-decoration:none; font-weight:bold; background-image:url([You must be registered and logged in to see this link.]);}

Bạn còn có thể làm mưa,bướm bay,tuyết rơi,pháo nổ,hoa lá bay,bong bóng nổi,và rất nhiều thứ khác,chỉ việc thay link ảnh trên bằng một trong các ảnh dưới đây.:Cách làm:
Bấm chuột phải vào hình mà bạn chọn,chọn Properties,chọn dòng URL,copy
cái link ảnh đó ra,chèn thay thế vào cái link ảnh trong đoạn mã trên. Ngoài ra,bạn còn có rất nhiều hình đẹp khác để lựa chọn .
Tìm
bức ảnh động phù hợp,sau đó click chuột phải,chọn Properties tìm dòng
URL để copy cái đường link của nó,rồi thay vào đường link ở trên nhé

Một số hiệu ứng tuyết rơi đẹp giúp các bạn chèn vào blog nè : ( các bạn copy và paste vào bất cứ chỗ nào chấp nhận html code )

1. Bông tuyết trắng lớn : [You must be registered and logged in to see this link.]

Code:

<script src="http://astuforum.free.fr/js/neige.js"></script>

2. Bông tuyết xanh : [You must be registered and logged in to see this link.]

Code:

<script src="http://astuforum.free.fr/js/neige_lettre.js"></script>

3. Bông tuyết nhỏ : [You must be registered and logged in to see this link.]

Code:

<script src="http://astuforum.free.fr/js/neige-mini.js"></script>

4. Bông tuyết trắng li ti, tự đổi chiều gió : [You must be registered and logged in to see this link.]

Code:

<script src="http://astuforum.free.fr/js/snow.js"></script>

5. Bóng tuyết nhỏ : [You must be registered and logged in to see this link.]

Code:

<script src="http://s1.wordpress.com/wp-content/plugins/snow/snowstorm.js"></script>

-------------------------------------

Ngoài ra, còn có một số hiệu ứng giúp bạn trang trí blog của mình nữa :

1. Đèn nháy và ngôi sao bảy sắc cầu vồng : [You must be registered and logged in to see this link.]

Code:

<script src="http://sd-1.archive-host.com/membres/up/28346071248525984/guirlande.js"></script>

2. Cây thông noel lung linh : [You must be registered and logged in to see this link.]

Code:

<script src="http://sd-1.archive-host.com/membres/up/28346071248525984/sapin.js"></script>

3. Mũ & tay & ngôi sao của ông già noel nhảy múa :[You must be registered and logged in to see this link.]

Code:

<script src="http://scripts.webnetters.org/neige.php"></script>