Tải bản đầy đủ (.docx) (3 trang)

Code tao banner quang cao chay tu dong ngang web

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (37.18 KB, 3 trang )

<span class='text_page_counter'>(1)</span>Code tạo banner quảng cáo chạy tự động ngang web Các bạn lưu ý phần code có 2 phần: Phần 1: add vào css .rollBox{width:620px;overflow:hidden;margin:0 auto;} .rollBox .Cont{width:620px;overflow:hidden;margin:0 auto;padding-top:20px;} .rollBox .ScrCont{width:10000000px;} .rollBox .Cont .pic{width:130px;float:left;text-align:center;padding-right:20px;} *+html .rollBox .Cont .pic{width:130px;float:left;text-align:center;padding-right:30px;} .rollBox .Cont .pic img{padding:4px;background:#fff;border:1px solid #ccc;display:block;margin:0 auto;} .rollBox .Cont .pic p{line-height:26px;color:#505050;} .rollBox .Cont a:link,.rollBox .Cont a:visited{color:#626466;text-decoration:none;} .rollBox .Cont a:hover{color:#f00;text-decoration:underline;} .rollBox #List1,.rollBox #List2{float:left;} Các bạn có thể sữa lại cấu hình chiều rộng hoặc cao theo web của mình ( nhưng nhớ là back up web trước nhé sau đó test đầy đủ rồi hãy sử dụng) Phần 2: các bạn chèn vào nên cần đặt slide nhé: Lưu ý các phần sau: Màu đỏ là link hình nút chuyển hướng qua trái hoặc phải, các bạn có thể thiết kế lại cho đẹp và up lên web lấy link chèn vào nhé Màu xanh là link web tùy chỉnh cho từng hình ảnh và link hình ảnh kèm theo <div class="rollBox"><img class="img1" onmousedown="ISL_GoDown()" onmouseup="ISL_StopDown()" onmouseout="ISL_StopDown()" src=" alt="" width="12" height="31" /> <div id="ISL_Cont" class="Cont"> <div class="ScrCont"> <div id="List1"><!-- B?t ??u --> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div>.

<span class='text_page_counter'>(2)</span> <div class="pic"><a href="link web" target="_blank"><img src="Link hình" alt="" width="130" height="95" /></a></div> <!-- K?t th?c --></div> <div id="List2">&nbsp;</div> </div> </div> <img class="img2" onmousedown="ISL_GoUp()" onmouseup="ISL_StopUp()" onmouseout="ISL_StopUp()" src=" alt="" width="12" height="31" /></div> <script type="mce-text/javascript" language="javascript">// <![CDATA[ //--><![CDATA[//><!-var Speed = 10; // var Space = 10; // var PageWidth = 160; // var fill = 0; // var MoveLock = false; var MoveTimeObj; var Comp = 0; var AutoPlayObj = null; GetObj("List2").innerHTML = GetObj("List1").innerHTML; GetObj('ISL_Cont').scrollLeft = fill; GetObj("ISL_Cont").onmouseover = function(){clearInterval(AutoPlayObj);} GetObj("ISL_Cont").onmouseout = function(){AutoPlay();} AutoPlay(); function GetObj(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval ('document.all.'+objName)}} function AutoPlay(){ // clearInterval(AutoPlayObj); AutoPlayObj = setInterval('ISL_GoDown();ISL_StopDown();',5000); // } function ISL_GoUp(){ // if(MoveLock) return; clearInterval(AutoPlayObj); MoveLock = true; MoveTimeObj = setInterval('ISL_ScrUp();',Speed); } function ISL_StopUp(){ // clearInterval(MoveTimeObj); if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0){ Comp = fill - (GetObj('ISL_Cont').scrollLeft % PageWidth); CompScr(); }else{ MoveLock = false; } AutoPlay(); } function ISL_ScrUp(){ // if(GetObj('ISL_Cont').scrollLeft <= 0){GetObj('ISL_Cont').scrollLeft = GetObj ('ISL_Cont').scrollLeft + GetObj('List1').offsetWidth} GetObj('ISL_Cont').scrollLeft -= Space ; } function ISL_GoDown(){ // clearInterval(MoveTimeObj); if(MoveLock) return; clearInterval(AutoPlayObj); MoveLock = true; ISL_ScrDown(); MoveTimeObj = setInterval('ISL_ScrDown()',Speed); }.

<span class='text_page_counter'>(3)</span> function ISL_StopDown(){ // clearInterval(MoveTimeObj); if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0 ){ Comp = PageWidth - GetObj('ISL_Cont').scrollLeft % PageWidth + fill; CompScr(); }else{ MoveLock = false; } AutoPlay(); } function ISL_ScrDown(){ // if(GetObj('ISL_Cont').scrollLeft >= GetObj('List1').scrollWidth){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft - GetObj('List1').scrollWidth;} GetObj('ISL_Cont').scrollLeft += Space ; } function CompScr(){ var num; if(Comp == 0){MoveLock = false;return;} if(Comp < 0){ // if(Comp < -Space){ Comp += Space; num = Space; }else{ num = -Comp; Comp = 0; } GetObj('ISL_Cont').scrollLeft -= num; setTimeout('CompScr()',Speed); }else{ // if(Comp > Space){ Comp -= Space; num = Space; }else{ num = Comp; Comp = 0; } GetObj('ISL_Cont').scrollLeft += num; setTimeout('CompScr()',Speed); } } //--><! // ]]></script>. Chúc các bạn thành công.

<span class='text_page_counter'>(4)</span>

×