Cực HOT

Floating Bar



Đoạn script này sẽ hiển thị một thanh nổi ở trên cùng của cửa sổ, lướt nhẹ nhàng trở lại vào view khi trang được cuộn vào. Thường  nội dung HTML có thể được hiển thị bên trong. Và để làm cho thanh công cụ tiện ích hơn, một khi nó được đóng lại (bằng cách nhấp vào "x"), Thanh bar công cụ có thể được thiết lập để giảm tải cho toàn bộ thời gian tải trang của  trình duyệt, bằng cách sử dụng cookies.

STEP #1
Bạn Log in vào Blogger -> Layout -> Edit HTML và bạn đánh dấu vào mục Expand Widget Templates
Sau đó, bạn dùng chức năng find (CTRL+F) tìm đoạn code sau trong template:


</head>
Và trước nó ABOVE/BEFORE bạn copy và dán đoạn code dưới vào:

<style type="text/css">
#topbar{
position:absolute;






border: 1px solid black;
padding: 2px;
background-color: lightyellow;
width: 620px;
visibility: hidden; z-index: 100; } </style> <script type="text/javascript"> /*********************************************** * Floating Top Bar script- © Dynamic Drive (www.dynamicdrive.com) * Sliding routine by Roy Whittle (http://www.javascript-fx.com/) * This notice must stay intact for legal use. * Visit http://www.dynamicdrive.com/ for full source code * Code via http://bloggerstop.net ***********************************************/ var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session var startX = 30 //set x offset of bar in pixels var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){ return (document.compatMode &amp;&amp; document.compatMode!="BackCompat")? document.documentElement : document.body } function get_cookie(Name) { var search = Name + "=" var returnvalue = ""; if (document.cookie.length > 0) { offset = document.cookie.indexOf(search) if (offset != -1) { offset += search.length end = document.cookie.indexOf(";", offset); if (end == -1) end = document.cookie.length; returnvalue=unescape(document.cookie.substring(offset, end)) } } return returnvalue; } function closebar(){ if (persistclose) document.cookie="remainclosed=1" document.getElementById("topbar").style.visibility="hidden" } function staticbar(){ barheight=document.getElementById("topbar").offsetHeight var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera; var d = document; function ml(id){ var el=d.getElementById(id); if (!persistclose || persistclose &amp;&amp; get_cookie("remainclosed")=="") el.style.visibility="visible" if(d.layers)el.style=el; el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";}; el.x = startX; if (verticalpos=="fromtop") el.y = startY; else{ el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight; el.y -= startY; } return el; } window.stayTopLeft=function(){ if (verticalpos=="fromtop"){ var pY = ns ? pageYOffset : iecompattest().scrollTop; ftlObj.y += (pY + startY - ftlObj.y)/8; } else{ var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight; ftlObj.y += (pY - startY - ftlObj.y)/8; } ftlObj.sP(ftlObj.x, ftlObj.y); setTimeout("stayTopLeft()", 10); } ftlObj = ml("topbar"); stayTopLeft(); } if (window.addEventListener) window.addEventListener("load", staticbar, false) else if (window.attachEvent) window.attachEvent("onload", staticbar) else if (document.getElementById) window.onload=staticbar </script>
.,

Now click Save Template
.,


Bạn vào tiếp Layout -> Page Elements -> Click "Add a Gadget" và chọn "HTML/JavaScript"




image


Bạn copy và dán đoạn mã này vào gadget
<div id="topbar">
<a href="#" onclick="closebar(); return false"><img src="http://i37.tinypic.com/2vd051i.gif" align="right" border="0" />
<a href="http://bdlab.blogspot.com/" onclick="closebar(); return true">Your content here.
</div>

Click Save

Recent Post

Related Posts Plugin for WordPress, Blogger...