Thanh di chuyển lên,xuống,cuộn trang cho Blog

Người đăng: nhung dieu hay on Chủ Nhật, 2 tháng 6, 2013

Để thuận tiện hơn trong việc di chuyển trên trang ,cuộn trang theo kiểu xoắn ốc đây là thủ thuật tạo ra các nút di chuyển Home, Page Up, Page Down And và cuôn trang dự động!
Ảnh mịnh họa:



Cách thực hiện:
1. Đăng nhập Blogger
2. Chọn mẫu--> Chỉnh sảu HTML
3.Tìm đến thẻ </body> và dán code bên dưới vào trước nó:




<style>
#dp-scroll{position:fixed;z-index:9999;bottom:0;right:0}
#dp-scroll a{display:block;float:left;background-color:#5cd4f5;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLJAC1AIjUVoJxVZa2iZihAdkGI4hcU9PxGfUjVnBE6nEkv1Wh5v44I-zGbJL9iLAiyiQsHqW9ZeyA5fWHokKtqrbsGEMA2SmaSCsYBbMEmC2dbkuRbGRaBBwN-HWaWjAsHPGo8vxZ3ew/s216/scroll.png);width:36px;height:36px;text-indent:-999em}
#dp-scroll a.dp-up{background-position:0 -36px}
#dp-scroll a.dp-down{background-position:0 -72px}
#dp-scroll a.dp-bottom{background-position:0 -108px}
#dp-scroll a.dp-scroll{background-position:0 -144px}
#dp-scroll a.dp-stop{background-position:0 -180px}
#dp-scroll a:hover{background-color:#5cbbf5}
</style>
<script>
function autoScroll(){window.scrollBy(0,1);scrolldelay=setTimeout('autoScroll()',
50)}
function stopScroll(){clearTimeout(scrolldelay)}
</script>
<div id='dp-scroll'>
<a class='dp-top' href='javascript:window.scrollTo(0,0);' rel='nofollow' title='To Top'>To Top</a>
<a class='dp-up' href='javascript:window.scrollBy(0,-window.innerHeight);' rel='nofollow' title='Page Up'>Page Up</a>
<a class='dp-down' href='javascript:window.scrollBy(0,window.innerHeight);' rel='nofollow' title='Page Down'>Page Down</a>
<a class='dp-bottom' href='javascript:window.scrollTo(0,999999);' rel='nofollow' title='To Bottom'>To Bottom</a>
<a class='dp-scroll' href='javascript:autoScroll();' rel='nofollow' title='Auto Scroll'>Auto Scroll</a>
<a class='dp-stop' href='javascript:stopScroll();' rel='nofollow' title='Stop Scroll'>Stop Scroll</a>
</div>

Tăng hoặc giảm giá trị 50 để giảm hoặc tăng tốc độ tự động cuộn trang.

Chúc các bạn thành công!

{ 0 nhận xét... read them below or add one }

Đăng nhận xét