Close බට්න් එකක් සමග Fixed top bar එකක් බ්ලොග් එකට දාගමු.

       මෙන්න තවත් අලුත් බ්ලොග් ගැජට් කෑල්ලක් ගෙනාවා. මේකෙ සිංහල තේරුම කියන්න මට තේරෙන්නේ නෑ. Fixed කියන්නේ ස්ථාවර, Top කියන්නේ ඉහළ, Bar කියන්නේ බාර් එකටනේ.. එතකොට "ස්ථාවර ඉහළ බාර්" එක තමා තේරුම. මේකට ඒ නම කියුවත් වැරැද්දක් නෑ. කොහොම උනත් නියම ගැජට් එකක්. බ්ලොග් එකක් කරගෙන යන යාළුවන්ට අනිවාර්යෙන් වැදගත් වෙනවමයි.

මේකෙන් පුළුවන් අපිට අපේ බ්ලොග් ලියන යාළුවන්ට අපිට ඕන පණිවිඩයක් එහෙම දෙන්න. මුලින්ම වැඩේ කොහොමද කියල Demo එක බලන්නකෝ.

කොහොමද නියමයි නේ. ඔය Demo බ්ලොග් එකේ උඩින්ම තියෙන්නේ. මේකෙ වාසි කිහිපයක්ම තියනවා. ඒ මේවයි.

1. කොහෙට Scroll කරත් දර්ශණය වීම.
2. එය නැරඹීමට අවශ්‍යතාවයක් නැතිනම් ඉවත් කිරීම සඳහා Close button එකක් තිබීම.
3. ඉක්මනින් ලෝඩ් වීම.
4. ඔබට අවශ්‍ය පුවතක් වැනි දෑ දර්ශණය කළ හැකි වීම.
5. ස්ථාපනය පහසු වීම

ම්ම්ම්ම්... මරු නේ. මේකෙ වැඩ කෑලි ඔහොම තිබ්බට දාගන්න එච්චර අමාරු නෑ. නිකන් Layout ගිහින් HTML/Java Script එකක් විදිහට කෝඩ් එකක් දාන්න තියෙන්නේ.  එහෙනම් ඔන්න පල්ලෙහයින් ඇති කෝඩ් එක....  

------------------------------------------------------------------------------------------------------------

<!-- This Is A Copyrighted "www.pasinduzone.info" Widget, Don't Try To Theft It Otherwise... -->

<style>

#exebar{

background: #7d7e7d; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdkN2U3ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwZTBlMGUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);

background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */

background: linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-8 */

width:100%;

text-align:center;

top:0px;

left:0px;

border-bottom: 1px solid #888888;

z-index: 999;

height: 28px;

position:fixed;

line-height: 2.2em;

color:#fff;

font-size:13px;

font-weight:bold;

font-family: arial,"Helvetica",sans-serif;

}

#exebar a{color:#eeff00;text-decoration:none;}

#exebar a:hover{text-decoration:underline;}

</style>

<script type='text/javascript'>

//<![CDATA[

function closeTopAds() {document.getElementById("exebar").style.display = "none";}

//]]>

</script>

<div id='exebar'>

+++Your Text Here...+++

<center style='padding:0px; float:right; cursor:pointer;' onclick='closeTopAds();return false;'>(X)&nbsp;&nbsp;</center>

</div>

<!-- This Is A Copyrighted "www.pasinduzone.info" Widget, Don't Try To Theft It Otherwise... -->

------------------------------------------------------------------------------------------------------------

+++Your Text Here...+++ කියන තැනට ඔයාලට ඕනි වාක්‍ය දාන්න..

එහෙනම් මම කැපුනා. අවුලක් ගියොත් කොමෙන්ට් එකක් දන්න...