Thiet ke web, thiết kế web, thiết kế website, thiet ke website

Hướng dẫn cách tạo module trượt 2 bên trong Joomla 1.5. Áp dụng thích hợp nhất cho mod_banners làm quảng cáo tự động trượt 2 bên website. Tùy chỉnh code cho phù hợp với website của bạn.
Chèn đoạn mã sau vào cuối file index.php trong thư mục Joomla template của bạn.

Ví dụ: /Joomla/templates/sieuhostvn/index.php.
Chèn vào cuối trang trước khi đóng thẻ </body>
Mã HTML:

<div id="AdsRight">
 
<jdoc:include type="modules" name="floatright" />

</div>
<div id="AdsLeft">
 
<jdoc:include type="modules" name="floatleft" />

</div>

Mã Javascript:

<script type="text/javascript">

function f_clientWidth() {
 return f_filterResults (
 window.innerWidth ? window.innerWidth : 0,
 document.documentElement ? document.documentElement.clientWidth : 0,
 document.body ? document.body.clientWidth : 0
 );
}
function f_clientHeight() {
 return f_filterResults (
 window.innerHeight ? window.innerHeight : 0,
 document.documentElement ? document.documentElement.clientHeight : 0,
 document.body ? document.body.clientHeight : 0
 );
}
function f_scrollLeft() {
 return f_filterResults (
 window.pageXOffset ? window.pageXOffset : 0,
 document.documentElement ? document.documentElement.scrollLeft : 0,
 document.body ? document.body.scrollLeft : 0
 );
}
function f_scrollTop() {
 return f_filterResults (
 window.pageYOffset ? window.pageYOffset : 0,
 document.documentElement ? document.documentElement.scrollTop : 0,
 document.body ? document.body.scrollTop : 0
 );
}
function f_filterResults(n_win, n_docel, n_body) {
 var n_result = n_win ? n_win : 0;
 if (n_docel && (!n_result || (n_result > n_docel)))
 n_result = n_docel;
 return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
}
</script>

Hiển thị quảng cáo trượt phải

<script type="text/javascript">
var positionFooter; 
 var positionRight = 0;
 var widthAds = 110;
 var heightAds = 200;
var div = document.getElementById('divPositionRightBannerFloat');
if(div!=null)
 positionRight = div.offsetTop;

document.getElementById('AdsRight').style.display = "block";
var yy = 0;
var toptop=0;
var beforeTop = 0;
// Hien thi quang cao truot phai
function ShowAds()
{               
 yy = f_clientWidth() - widthAds - 24;//padding left
 toptop = (f_scrollTop() - beforeTop)/8;            
 beforeTop = toptop + beforeTop + 3;
 
 if(beforeTop < 5)
 document.getElementById('AdsRight').style.top = f_scrollTop() + 'px';
 else
 document.getElementById('AdsRight').style.top = beforeTop + 'px';
 
 beforeTop = parseInt(document.getElementById('AdsRight').style.top.substring(0,document.getElementById('AdsRight').style.top.length - 2));
 
 document.getElementById('AdsRight').style.left = yy  + 'px';
 
 document.getElementById('AdsRight').style.display = "block";
 
 if(beforeTop < positionRight + heightAds)
 document.getElementById('AdsRight').style.display = "none";
 
 var divFooter =  document.getElementById('divPositionFloatBannerFooter');                    
 if(divFooter!=null)
 positionFooter = divFooter.offsetTop;  
 
 if(beforeTop > positionFooter + heightAds)
 document.getElementById('AdsRight').style.display = "none";
 
 setTimeout('ShowAds()', 50);        
}
ShowAds();
</script>

Hiển thị quảng cáo trượt trái

<script type="text/javascript">

// Hien thi quang cao truot trai
function ShowAds2()
{               
    yy = f_clientWidth() - widthAds - 24;//padding left
    toptop = (f_scrollTop() - beforeTop)/8;            
    beforeTop = toptop + beforeTop + 3;
    
    if(beforeTop < 5)
        document.getElementById('AdsLeft').style.top = f_scrollTop() + 'px';
    else
        document.getElementById('AdsLeft').style.top = beforeTop + 'px';
        
    beforeTop = parseInt(document.getElementById('AdsLeft').style.top.substring(0,document.getElementById('AdsLeft').style.top.length - 2));
    
    document.getElementById('AdsLeft').style.right = yy  + 'px';
    
    document.getElementById('AdsLeft').style.display = "block";
    
    if(beforeTop < positionRight + heightAds)
        document.getElementById('AdsLeft').style.display = "none";
                             
    setTimeout('ShowAds2()', 50);        
}	    
// Hien thi quang cao truot trai + phai	

ShowAds2();

</script>

Hoặc tải file advertisement.js về và chèn đoạn mã sau

<script type="text/javascript" src="/cntt/js/advertisement.js"></script>

Mã CSS chèn vào file template CSS hoặc chèn vào head:

#AdsRight{
 z-index: 9999;
 position: absolute; 
 width: 110px; 
 height: 200px; 
 display: none;
}
#AdsLeft{
 z-index: 9999;
 position: absolute; 
 width: 110px; 
 height: 200px; 
 display: none;
}

Truy cập Back End >> Quản lý mô đun.
Chọn module cần trượt gán vào vị trí floatleft hoặc floatright.