Archive for May 7, 2008

Pagination Links Using Css

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Untitled Document</title>
<style type=”text/css”>

.pagination{
padding: 2px;
}

.pagination ul{
margin: 0;
padding: 0;
text-align: left; /*Set to “right” to right align pagination interface*/
font-size: 16px;
}

.pagination li{
list-style-type: none;
display: inline;
padding-bottom: 1px;
}

.pagination a, .pagination a:visited{
padding: 0 5px;
border: 1px solid #9aafe5;
text-decoration: none;
color: #2e6ab1;
}

.pagination a:hover, .pagination a:active{
border: 1px solid #2b66a5;
color: #000;
background-color: #FFFF80;
}

.pagination a.currentpage{
background-color: #2e6ab1;
color: #FFF !important;
border-color: #2b66a5;
font-weight: bold;
cursor: default;
}

.pagination a.disablelink, .pagination a.disablelink:hover{
background-color: white;
cursor: default;
color: #929292;
border-color: #929292;
font-weight: normal !important;
}

.pagination a.prevnext{
font-weight: bold;
}

</style>

</head>

<body>
<div class=”pagination”>
<ul>
<li><a href=”#” class=”prevnext disablelink”>« previous</a></li>
<li><a href=”#” class=”currentpage”>1</a></li>
<li><a href=”#”>2</a></li>
<li><a href=”#”>3</a></li>
<li><a href=”#”>4</a></li>
<li><a href=”#”>5</a></li>
<li><a href=”#”>6</a></li>
<li><a href=”#”>7</a></li>
<li><a href=”#”>8</a></li>
<li><a href=”#”>9</a>…</li>
<li><a href=”#”>15</a></li>
<li><a href=”#”>16</a></li>
<li><a href=”#” class=”prevnext”>next »</a></li>
</ul>
</div>

</body>
</html>

desimartini

selva_anju@yahoo.com+mummy name

selva.phpprogrammer@yahoo.com+mummy name

senswastika@yahoo.co.in+mummy name

swadharsan@yahoo.com+mummy name

popuplogin

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<head>
<title>Popup Box</title>
<style type=”text/css”>
#popupbox{
margin: 0;
margin-left: 40%; /* This gets it relatively center on the screen */
margin-right: 40%; /* This gets it relatively center on the screen */
margin-top: 50px; /* Makes it a little off the top of the screen */
padding-top: 10px; /*  Make the text not touching the top on the login box */
width: 20%; /* For centering it on the screen */
height: 150px; /* The height of the login box */
position: absolute; /* Makes sure its absolute so it doesn’t dock with everything else */
background: skyblue; /* Login Box background color. Change this if desired. */
border: solid #000000 2px; /* Makes a black border around the login box */
z-index: 9; /* Makes it on top of everything else */
font-family: arial; /* Sets the font */
visibility: hidden; /* Makes it hidden at first. Very Important.*/
}
</style>
<script language=”JavaScript” type=”text/javascript”>
function login(showhide){
if(showhide == “show”){
document.getElementById(’popupbox’).style.visibility=”visible”; /* If the function is called with the variable ’show’, show the login box */
}else if(showhide == “hide”){
document.getElementById(’popupbox’).style.visibility=”hidden”; /* If the function is called with the variable ‘hide’, hide the login box */
}
}
</script>
</head>
<body>

<div id=”popupbox”> <!–Start login box–>
<form name=”login” action=”" method=”post”>
<center>Username:</center>
<center><input name=”username” size=”14″ /></center>
<center>Password:</center>
<center><input name=”password” type=”password” size=”14″ /></center>
<center><input type=”submit” name=”submit” value=”login” /></center>
</form>
<br />
<center><a href=”javascript:login(’hide’);”>close</a></center> <!– Closes the box–>
</div> <!–End login box–>
<p><a href=”javascript:login(’show’);”>login</a></p> <!–Opens the box –>
</body>
</html>