[ Yêu cầu ] Tạo banner quảng cáo trượt dọc 2 bên (Với việc ẩn hiện tùy vào độ phân giải của màn hình)

Trang chủ » B-advance » Thu Thuat Blog » Thủ thuật Blogger » Bạn đang xem:

[ Yêu cầu ] Tạo banner quảng cáo trượt dọc 2 bên (Với việc ẩn hiện tùy vào độ phân giải của màn hình)

Thứ Năm, 6 tháng 8, 2009

Theo yêu cầu của bạn Ngân (www.blogtruyen.com)

[FD's BlOg] - Chúng ta đã khá quen với banner trượt quảng cáo trượt dọc ở 2 bên của 1 site nào đó. đa phần các banner này được thiết kế nằm sát 2 mép (trái & phải) của 1 website nào đó, và nó luôn trượt theo khi ta di chuyển chuột. Ở bài hướng dẫn này mình sẽ giới thiệu 1 cách hiển thị khác, đó là banner quảng cáo sẽ nằm ở 2 mép trái và phải của màn hình hiển thị, và việc hiển thị của nó sẽ phụ thuộc vào chế độ xem của màn hình.

Xem DEMO
(lưu ý : nếu bạn không thấy banner quảng cáo thì zoom nhỏ lại (Ctrl -) banner sẽ hiển thị, nếu muốn test không hiển thị thì zoom lớn lên (Ctrl +))

Hình ảnh minh họa :

☼ Các bước thực hiện :
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Chèn đoạn code bên dưới vào trước thẻ đóng </head>

4. Save template.
5. Tạo 1 widget HTML/javascript và dán code bên dưới vào:

- để đơn giản các bạn có thể gộp code của bước 3 và 5 vào chung trong bước 5, tức là dán tất cả code của thủ thuật vào widget HTML/javascript.
- Ngoài ra code ở bước 5 ta có thể dán nó thẳng vào trong code template.
- Lưu ý : file JS http://data.fandung.com/js/slide_ads.js luôn phải đặt ở vị trí sau cùng của code thủ thuật. Tức là phải load phần code HTML trước phần code JS.

Ở thủ thuật này, với màn hình có độ phân giải trên 1024px thì banner mới hiển thị. Chi tiết có thể xem trong file slide_ads.js

Chúc các bạn thành công.
Copy bài viết: