![[PICS/VIDS] SNSD @ Girls' Generation 2nd Tour in HongKong](http://4.bp.blogspot.com/-Zu_su9nayxM/TxUkZ70sPCI/AAAAAAAAA00/HKUHh3RHE7M/s72-c/IMG_5393.JPG)
![[PICS/VIDS] SNSD @ Seoul Music Award Red Carpert + Performance || 19.01.12](http://4.bp.blogspot.com/-qe1aeICs3xU/Txz1IAckHLI/AAAAAAAABfg/6QahAr_PCJU/s72-c/%25EC%259C%2584%25EB%2593%259C%25EC%2586%258C%25EC%258B%259C35.jpg)
![[PICS/VID] SNSD @ KBS Entertainment Awards || 24.12.11](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhag0GpEOkNKZGlvZ3ec-75wq49zK_nkP41LI9OE4Sr6NItRWu7-_1CO8pXs7Lp-6iGzMrQpd0gMF84lmMnPU3iz4Mdet2pwGlffQSVYmZKBymZfH2spuVVoFSA0-I_c8YOk03vB395UZ1W/s72-c/10.jpg)
![[23.01.12] SNSD biểu diễn tại Concert Thế vận hội mùa đông 2018 ở Pyejongchang](http://2.bp.blogspot.com/-cENAQmq4yWQ/Tx00HH7uvsI/AAAAAAAABoI/qeK67zZjlDI/s72-c/SNSD_Pyeongchang.jpg)
![[23.01.12] Sunny gửi tặng Gaeko nhóm Dynamic Duo một chiếc bánh sinh nhật !](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQkCZSQ-hKEj9JMR8TmxySt7NpAhCnVln5Xudrk0USkLtT-WvI2Pa0DIj_JrFGrB6IieKOD6K6W1oQhRMdI4UZ39ACxU6LPc5GB9pJ3CFMyAi-9MLQGot80HtDn8I452ldn-bD_oxbeUU/s72-c/sunnywinter.jpg)
![[23.01.12] Yuri được bình chọn là thành viên tuyệt nhất với trang phục xuyên thấu giữa các nhóm nhạc nữ](http://4.bp.blogspot.com/-Hak8OR7FI-M/Tx01aUUMonI/AAAAAAAABoQ/bqYVyV0_UI4/s72-c/20120119122131_1_rstarpsy.jpg)
Tạo banner quảng cáo trượt hai bên blog
* Tạo banner quảng cáo trượt hai bên 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 : LIVE 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 +))
☼ 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>
<style type="text/css">
.slideads1 {text-align:left}
.slideads2 {text-align:right}
</style>
4. Save template.
5. Tạo 1 widget HTML/javascript và dán code bên dưới vào:
<div id="divAdLeft" style="position: absolute; width: 110px; float: left; left: 0pt; top: 0.00000103038px;">
<div class="slideads1">
<a href="http://fandung.blogspot.com/"><img src="link banner 1" border="0"></a>
</div>
</div>
<div id="divAdRight" style="position: absolute; width: 120px; float: right; left: 989px; top: 0.00000100252px;">
<td class="slideads2">
<a href="http://fandung.blogspot.com/" target="_blank"><img src="link banner 2" border="0"></a>
</div>
</div>
<script language="JavaScript" src="http://fandung.110mb.com/banner-slide/slide_ads.js"></script>- để đơ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://fandung.110mb.com/banner-slide/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.
Xem demo : LIVE 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>
<style type="text/css">
.slideads1 {text-align:left}
.slideads2 {text-align:right}
</style>
4. Save template.
5. Tạo 1 widget HTML/javascript và dán code bên dưới vào:
<div id="divAdLeft" style="position: absolute; width: 110px; float: left; left: 0pt; top: 0.00000103038px;">
<div class="slideads1">
<a href="http://fandung.blogspot.com/"><img src="link banner 1" border="0"></a>
</div>
</div>
<div id="divAdRight" style="position: absolute; width: 120px; float: right; left: 989px; top: 0.00000100252px;">
<td class="slideads2">
<a href="http://fandung.blogspot.com/" target="_blank"><img src="link banner 2" border="0"></a>
</div>
</div>
<script language="JavaScript" src="http://fandung.110mb.com/banner-slide/slide_ads.js"></script>
- 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://fandung.110mb.com/banner-slide/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.
Đăng nhận xét