HƯỚNG DẪN TẠO QUẢNG CÁO TRƯỢT 2 BÊN TRANG WEB
Live DEMO :
http://vinhkhang.webdoanhnghiep.org/quangcao/
Hình ảnh này đã được thay đổi kích thước. Click vào đây để xem hình ảnh gốc với kích thước là 1024x768
Download source tại đây :
http://www.mediafire.com/?idu6qjod4687hlq
Hướng Dẫn :
Bước 1 :
Giải nén folder scriptquangcao, chép tất cả file trong folder scriptquangcao vao thư mục website của bạn
Bước 2 :
Mở trang index.php, paste đoạn code sau vào trước </head> :
PHP Code:
<SCRIPT src="floater_xlib.js" type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
var slideTime = 700;
var floatAtBottom = false;
function pepsi_floating_init()
{
xMoveTo('floating_banner_right', 887 - (1024-screen.width), 0);
winOnResize(); // set initial position
xAddEventListener(window, 'resize', winOnResize, false);
xAddEventListener(window, 'scroll', winOnScroll, false);
}
function winOnResize() {
checkScreenWidth();
winOnScroll(); // initial slide
}
function winOnScroll() {
var y = xScrollTop();
if (floatAtBottom) {
y += xClientHeight() - xHeight('floating_banner_left');
}
xSlideTo('floating_banner_left', (screen.width - (800-775) - 770)/2-115 , y, slideTime); // Chỉnh khoảng cách bên trái
xSlideTo('floating_banner_right', (screen.width - (800-795) + 770)/2, y, slideTime); // // Chỉnh khoảng cách bên Phải
}
function checkScreenWidth()
{
if( document.body.clientWidth < 926 )
{
document.getElementById('floating_banner_left').style.display = 'none';
document.getElementById('floating_banner_right').style.display = 'none';
}
else
{
document.getElementById('floating_banner_left').style.display = '';
document.getElementById('floating_banner_right').style.display = '';
}
}
</SCRIPT>
Bước 3 : Paste đoạn code sau vào sau <body>
PHP Code:
<div id="floating_banner_left" style="text-align:right; position:absolute; overflow:hidden; top: 0px; left: 0px; width: 105px; border: 0px solid #000;">
<div id="floating_banner_left_content">
<a href="#" target="_blank"><img src="lien1.jpg" border="0" width="105px" alt="" /></a><br />
</div>
</div>
<div id="floating_banner_right" style="text-align:left; position:absolute; overflow:hidden; top: 0px; right: 0px; width: 105px; border: 0px solid #000;">
<div id="floating_banner_right_content" >
<a href="#" target="_blank"><img src="lien2.jpg" border="0" width="105px" alt="" /></a><br />
</div>
</div>
<script>
runQuery();
</script>
<script>
pepsi_floating_init();
</script>
Bạn có thể thay đổi hình nếu bạn muốn, vào đọan code mới paste sửa như hình dưới : 
Chúc bạn thành công
Không có nhận xét nào:
Đăng nhận xét
Chào mừng các bạn đến với Blog của Dương