Ads Nhà Tài Trợ
Nam Trung JSC Thớt Gỗ, Ván Ghép Các Loại

Cố định banner quảng cáo hay thẻ div khi cuộn trang

Đầu tiên bạn cần bạn cần thêm đoạn code này trước </head>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
    <style type='text/css'>
      #floatDivWrapper {font-size:11px}
      #floatDiv.fixed {position:fixed;top:45px;bottom:0}
    </style>
    <script type='text/javascript'>
      //<![CDATA[
var s=true;function doBlink(){$('.blink').css('display',function(index,val){s=!s;return (s)?'block':'none';})}
$(document).ready(function() {setInterval("doBlink()",200)});
//]]>
    </script>
    <script type='text/javascript'>
      //<![CDATA[
$(document).ready(function(){var documentH=$(document).height();if(documentH>1000){
//$("#floatDivWrapper").css('position','fixed');$("#floatDiv").css({'position':'fixed','top':0});
var bottomHeight=1000;var msie6=$.browser=='msie'&&$.browser.version<7;if(!msie6){var top=$('#floatDiv').offset().top-parseFloat($('#floatDiv').css('margin-top').replace(/auto/,0));$(window).scroll(function(event){var y=$(this).scrollTop();if(y>=top&&y<=(documentH-bottomHeight)){$('#floatDiv').addClass('fixed')}else{$('#floatDiv').removeClass('fixed')}})}}});
//]]>
    </script>
   
Bạn muốn cố định một phần tử trang bất kỳ hay quảng cáo. Chỉ cần đặt chúng trong thẻ này: 

<div id='floatDiv'>Đặt banner quảng cáo hay phần tử trang của bạn vào đây </div>

* Áp dụng để cố định PopularPost
<!-- Cố định Popular Post -->
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
    <style type='text/css'>
      #floatDivWrapper {font-size:11px}
      #floatDiv.fixed {position:fixed;top:45px;bottom:0}
    </style>
    <script type='text/javascript'>
      //<![CDATA[
var s=true;function doBlink(){$('.blink').css('display',function(index,val){s=!s;return (s)?'block':'none';})}
$(document).ready(function() {setInterval("doBlink()",200)});
//]]>
    </script>
    <script type='text/javascript'>
      //<![CDATA[
$(document).ready(function(){var documentH=$(document).height();if(documentH>1000){
//$("#floatDivWrapper").css('position','fixed');$("#floatDiv").css({'position':'fixed','top':0});
var bottomHeight=1000;var msie6=$.browser=='msie'&&$.browser.version<7;if(!msie6){var top=$('#floatDiv').offset().top-parseFloat($('#floatDiv').css('margin-top').replace(/auto/,0));$(window).scroll(function(event){var y=$(this).scrollTop();if(y>=top&&y<=(documentH-bottomHeight)){$('#floatDiv').addClass('fixed')}else{$('#floatDiv').removeClass('fixed')}})}}});
//]]>
    </script>
    <!-- Cố định Popular Post -->
Thêm PopularPost sau vào vị trí bạn muốn trong <body>
<div id='floatDiv'>

<div style='height:25px; line-height:25px; padding-left:20px; font-weight:bold; color:#0e1cb3'>
Hot, xem nhiều <img src='https://lh5.googleusercontent.com/-T_HE6OLDf1w/UNmPaGftVII/AAAAAAAABY4/hLHeEQgzZDQ/s35/icon-hot.gif'/>
</div>
<div class='most-view'>
<b:section class='sidebar1' id='sidebartab19' preferred='yes'>
<b:widget id='PopularPosts2' locked='false' title='Xem nhiều trong tuần' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2>
<data:title/>
</h2>
</b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == &quot;false&quot;'>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (1) No snippet/thumbnail -->
<a expr:href='data:post.href'>
<data:post.title/>
</a>
<b:else/>
<!-- (2) Show only snippets -->
<div class='item-title'>
<a expr:href='data:post.href'>
<data:post.title/>
</a>
</div>
<div class='item-snippet'>
<data:post.snippet/>
</div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'>
<a expr:href='data:post.href'>
<data:post.title/>
</a>
</div>
</div>
<div style='clear: both;'/>
<b:else/>
<!-- (4) Show snippets and thumbnails -->
<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'>
<a expr:href='data:post.href'>
<data:post.title/>
</a>
</div>
<div class='item-snippet'>
<data:post.snippet/>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</div>
CODE SƯU TẦM
Tags

Hiện thêm

Đăng nhận xét

0 Nhận xét
* Please Don't Spam Here. All the Comments are Reviewed by Admin.
Sở hữu một thiết kế thanh lịch và vô cùng đẳng cấp, mang trong mình một hiệu năng "cực khủng", chụp ảnh, quay phim chất lượng hàng đầu nhờ cụm 3 camera 50 MP. Thiết bị hoàn hảo dành cho dân làm việc văn phòng theo mô hình Workcation thích du lịch khám phá, làm Việc Từ Xa,... Thiết bị công nghệ số cực ngon dành cho TELEWORK, WFH, người làm nghề MMO, KOC / Streamer,...

Xem Giá Bán
Laptop Asus Gaming ROG Flow Z13 GZ301Z i7 12700H (LD110W), siêu phẩm hỗ trợ làm việc, học tập online, đem đến cho bạn những giây phút trải nghiệm giải trí cực đỉnh cùng laptop CPU thế hệ 12 mới nhất. Thiết kế lai giữa laptop gaming và máy tính bảng sáng tạo, sang chảnh, trang bị công nghệ tân tiến nhất, chinh phục mọi giới hạn cùng với cấu hình vượt trội.

Xem Giá Bán