Menu

Tin mới nhất

Menu

Thủ thuật tạo widget bất kì trượt 2 bên cho blogspot

Trước đây mình có một số bài viết về chủ đề tạo Widget cho blog . Hôm nay mình giới thiệu đến các bạn thêm một Thủ thuật tạo widget bất kì trượt 2 bên cho blogspot . Widget này sẽ tự động trượt theo blog khi chúng ta dùng các phím di chuyển và nó không làm ảnh hưởng đến tính thẩm mỹ của blog.
Ảnh minh họa :
Bắt đầu thủ thuật : 
1. Đăng nhập blogger
2. Chọn mẫu--> Chỉnh sửa HTML
3. Thêm đoạn mã dưới đây vào sau thẻ  <head>   trong template của bạn.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js' type='text/javascript'></script>

Nếu template của bạn cài Jquery rồi thì có thể bỏ qua bước này để tránh xung đột code
4. Vào blogger -->Bố cục --> Thêm tiện ích HTML/Javascript và dán code bên dưới vào 
<style type='text/css'>
#floatDivWrapper {font-size:11px}
#floatDiv.fixed {position:fixed;top:0px}
</style>
<script type='text/javascript'>//<![CDATA[
$(document).ready(function(){var documentHeight=$(document).height();if(documentHeight>2500){
//$("#floatDivWrapper").css('position','fixed');$("#floatDiv").css({'position':'fixed','top':30});
var bottomHeight=1200;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<=(documentHeight-bottomHeight)){$('#floatDiv').addClass('fixed')}else{$('#floatDiv').removeClass('fixed')}})}}});
//]]></script>
<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()",0)});
//]]></script>
<div class='widget HTML' id='floatDiv'>
Nội dung của widget
</div>


Các bạn điều chỉnh lại những chỗ mình đổi màu theo ý mình riêng phần Nội dung của widget là phần bạn muốn trượt dọc, nó có thể là một bức ảnh,thông báo,....
5. Lưu lại và xem kết quả
Chúc các bạn thành công !

Share This:

Blog Tự Động Hóa 68

Tôi là Đại Thành. Tôi thích chia sẽ đam mê về Điện Tự Động Hóa, Điện Lạnh Và Internet....Bài viết có thể chưa thật sự hoàn hảo nhưng hy vọng sẽ giúp ích được cho các bạn. Cảm ơn đã ghé trang.

Mời bạn bình luận cho bài viết " Thủ thuật tạo widget bất kì trượt 2 bên cho blogspot "

  • Thêm biểu tượng cảm xúc Show Icons
  • Thêm mã Code [pre]Mã Code ở đây[/pre]
  • Thêm ảnh [img]Link ảnh[/img]
  • Thêm Video thì dán liên kết như mẫu https://www.youtube.com/watch?v=iocNDTd4esg