07.36.00
Syamsudinnamaku
06.36.00
Syamsudinnamaku
17.28.00
Syamsudinnamaku
17.25.00
Syamsudinnamaku
14.26.00
Syamsudinnamaku
13.30.00
Syamsudinnamaku
12.00.00
Syamsudinnamaku
09.16.00
Syamsudinnamaku
14.16.00
Syamsudinnamaku
05.20.00
Syamsudinnamaku
13.07.00
Syamsudinnamaku
10.11.00
Syamsudinnamaku
09.27.00
Syamsudinnamaku
08.09.00
Syamsudinnamaku
01.01.00
Syamsudinnamaku
15.41.00
Syamsudinnamaku
15.15.00
Syamsudinnamaku
<style type="text/css">
#sy{
position:fixed;
bottom:20px;
left:1px;
z-index:+1000;
}
* html #sy{position:relative;}
.sytab{
height:45px;
width:30px;
float:right;
cursor:help;
background:url('https://lh5.googleusercontent.com/-vT8U7JXYvZU/Tj14DTueVRI/AAAAAAAABpI/Dp2KM52XL8w/array_float.gif') no-repeat;}
.sycontent{
float:right;
border:2px solid #CCC;
background:#FFF;
padding:5px;}
</style>
<script type="text/javascript">
function showHideSY(){
var sy = document.getElementById("sy");
var w = sy.offsetWidth;
sy.opened ? moveSY(20-w, 0) : moveSY(0, 35-w);
sy.opened = !sy.opened;}
function moveSY(x0, xf){
var sy = document.getElementById("sy");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
sy.style.left = x.toString() + "px";
if(x0!=xf){setTimeout("moveSY("+x+", "+xf+")", 90);}
}
</script>
<div id="sy">
<div class="sytab" onclick="showHideSY()" title="Show / Close" alt=""> </div>
<div class="sycontent">
<a href="URL iklan Anda di sini" target="_blank"><img src="URL image iklan Anda di sini" alt=".............." style="width:....px; height:....px;" border="0"/></a>
<script type="text/javascript">
var sy = document.getElementById("sy");
sy.style.left = (30-sy.onsetWidth).toString() + "px";
</script></div></div>
04.51.00
Syamsudinnamaku
<ul id="navigation"> <li class="about-me"><a href="URL Profile Anda/"><span>My Profile</span></a></li> <li class="facebook"><a href="URL Facebook Anda"><span>My Facebook</span></a></li> <li class="twitter"><a href="URL Twitter Anda"><span>My Twitter</span></a></li> <li class="e-mail"><a href="URL E-mail Anda"><span>My E-mail</span></a></li> <li class="rss"><a href="URL RSS Feed Anda"><span>RSS Feed</span></a></li> </ul>
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 0px;
list-style: none;
z-index:999999;
width:750px;
}
ul#navigation li {
width: 103px;
display:inline;
float:left;
border:0;
}
ul#navigation li a {
display: block;
float:left;
margin-top: 0px;
width: 100px;
height: 25px;
background-color:#fff;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #0000ff;
-moz-border-radius:0px 0px 8px 8px;
-webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-khtml-border-bottom-right-radius: 8px;
-khtml-border-bottom-left-radius: 8px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 1.0;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}
ul#navigation li a:hover{
background-color:#fff;
}
ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#ff0000;
font-family:trebuchet-ms, arial, tahoma, Sans-Serif;
font-weight:bold;
}
ul#navigation .about-me a {
background-image: url(http://3.bp.blogspot.com/_LZtXSNcp76A/TQO9lg8rMiI/AAAAAAAABUk/DwJNZAO8Wnc/s400/photo.png);
}
ul#navigation .facebook a {
background-image: url(http://1.bp.blogspot.com/_LZtXSNcp76A/TQO8LKKzUVI/AAAAAAAABT0/uDnhDlFgPuA/s400/facebook.png);
}
ul#navigation .twitter a {
background-image: url(http://3.bp.blogspot.com/_LZtXSNcp76A/TQO8MAfFqUI/AAAAAAAABUU/z1PwLV5UWlA/s400/twitter.png);
}
ul#navigation .e-mail a {
background-image: url(http://2.bp.blogspot.com/_LZtXSNcp76A/TQO9lQ5T9GI/AAAAAAAABUc/Nyk6OTOMOH8/s400/mail_edit.png);
}
ul#navigation .rss a{
background-image: url(http://4.bp.blogspot.com/_LZtXSNcp76A/TQO8L8P3ZKI/AAAAAAAABUM/CI6VTjlEZsI/s400/rss.png);
}<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});
$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
</script>
02.38.00
Syamsudinnamaku
<script type="text/javascript">
/***********************************************
* Floating Top Bar script- © Dynamic Drive
* Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
* This notice must stay intact for legal use.
* User http://www.syamsudinnamaku.blogspot.com/
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
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 && 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 && 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><div id="topbar"> <a href="" onClick="closebar(); return false"><img src="http://www.dynamicdrive.com/dynamicindex11/close.gif" border="0" /></a> Tulisan atau Gambar Anda Letakkan di sini. <img src="URL gambar Anda di sini" border="0" /><img src="URL gambar Anda di sini" border="0" /> </div>
01.27.00
Syamsudinnamaku
<div id="access"> <ul id="level-one"> <li><a href="URL nama blog Anda">Home</a></li> <li>Menu Item A <ul id="level-two"> <li><a href="URL Menu 1">Sub Menu 1</a></li> <li><a href="URL Menu 2">Sub Menu 2</a></li> <li><a href="URL Menu 3">Sub Menu 3</a></li> <li><a href="URL Menu 4">Sub Menu 4</a></li> <li><a href="URL Menu 5">Sub Menu 5</a></li> <li><a href="URL Menu 6">Sub Menu 6</a></li> <li><a href="URL Menu 7">Sub Menu 7</a></li> <li><a href="URL Menu 8">Sub Menu 8</a></li> </ul> </li> <li>Menu Item B <ul id="level-two"> <li><a href="URL Menu 1">Sub Menu 1</a></li> <li><a href="URL Menu 2">Sub Menu 2</a></li> <li><a href="URL Menu 3">Sub Menu 3</a></li> <li><a href="URL Menu 4">Sub Menu 4</a></li> <li><a href="URL Menu 5">Sub Menu 5</a></li> <li><a href="URL Menu 6">Sub Menu 6</a></li> <li><a href="URL Menu 7">Sub Menu 7</a></li> <li><a href="URL Menu 8">Sub Menu 8</a></li> </ul> </li> <li>Menu Item C <ul id="level-two"> <li><a href="URL Menu 1">Sub Menu 1</a></li> <li><a href="URL Menu 2">Sub Menu 2</a></li> <li><a href="URL Menu 3">Sub Menu 3</a></li> <li><a href="URL Menu 4">Sub Menu 4</a></li> <li><a href="URL Menu 5">Sub Menu 5</a></li> <li><a href="URL Menu 6">Sub Menu 6</a></li> <li><a href="URL Menu 7">Sub Menu 7</a></li> <li><a href="URL Menu 8">Sub Menu 8</a></li> </ul> </li> <li>Menu Item D <ul id="level-two"> <li><a href="URL Menu 1">Sub Menu 1</a></li> <li><a href="URL Menu 2">Sub Menu 2</a></li> <li><a href="URL Menu 3">Sub Menu 3</a></li> <li><a href="URL Menu 4">Sub Menu 4</a></li> <li><a href="URL Menu 5">Sub Menu 5</a></li> <li><a href="URL Menu 6">Sub Menu 6</a></li> <li><a href="URL Menu 7">Sub Menu 7</a></li> <li><a href="URL Menu 8">Sub Menu 8</a></li> </ul> </li> <li>Menu Item E <ul id="level-two"> <li><a href="URL Menu 1">Sub Menu 1</a></li> <li><a href="URL Menu 2">Sub Menu 2</a></li> <li><a href="URL Menu 3">Sub Menu 3</a></li> <li><a href="URL Menu 4">Sub Menu 4</a></li> <li><a href="URL Menu 5">Sub Menu 5</a></li> <li><a href="URL Menu 6">Sub Menu 6</a></li> <li><a href="URL Menu 7">Sub Menu 7</a></li> <li><a href="URL Menu 8">Sub Menu 8</a></li> </ul> </li> <li>Menu Item F</li> <li>Menu Item G</li> </ul> </div>
<style type="text/css">
ul#level-one{
width:100%;
height: 36px;
position: relative;
list-style: none;
line-height:36px;
background:#f0f0f0 url(http://www.entheosweb.com/tutorials/css/images/menus/menu-back.png) repeat-x bottom left;/* url("http://www.entheosweb.com/tutorials/css/images/menus/grey_bkg.jpg") repeat-x bottom left;/* for non-css3 browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#f0f0f0)); /* for webkit browsers */
background: -moz-linear-gradient(top, #FFFFFF, #f0f0f0); /* for firefox 3.6+ */
}
ul#level-one li{
width:100px;
float: left;
font-weight: bold;
font-family: Arial;
padding-left: 12px;
}
ul#level-one li:hover{
background:#FFA500;
}
ul#level-two{
list-style: none;
background:#FFA500 url(http://www.entheosweb.com/tutorials/css/images/menus/menu-grad.png) repeat-x bottom left; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF4500', endColorstr='#FFA500'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#FFA500), to(#FF4500)); /* for webkit browsers */
background: -moz-linear-gradient(top, #FFA500, #FF4500); /* for firefox 3.6+ */
display:none;
position:absolute;
top:36px;
padding:0;
width:200px;
height:245px;
border:0px solid red;
}
ul#level-two li{
width:196px;
padding-left:4px ;
line-height: 30px;
}
ul#level-two li:hover{
background:#f0f0f0 url(http://www.entheosweb.com/tutorials/css/images/menus/menu-li.png) repeat-x bottom left;/* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#000000'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#c0c0c0)); /* for webkit browsers */
background: -moz-linear-gradient(top, #fff, #c0c0c0); /* for firefox 3.6+ */
}
ul#level-one li:hover > ul#level-two {
display: block;
}
a{
width:200px;
text-align: center;
text-decoration: none;
color:#000000;
}
</style>
 |
 |
 |
