RS Tech: May 2013

Date Function with Calender Icon

Source Code:

 <!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=utf-8" />
<title>Calender</title>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="calendar_db.js"></script>
<link rel="stylesheet" href="calendar.css" type="text/css" />
<style>
.ratediv2
{
width:300px;
height:35px;
padding:20px;
border-radius:3px;
background-color:#f7f7f7;
margin:10px auto;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
border:1px solid #CCC;
margin-top:100px;
}       
</style>
</head>
<body>
<form action="" method="post" name="form">
<div class="ratediv2" >
<tr>
<td align="center">&nbsp;&nbsp;Date</td>
 <td align="center">
 <input type="text" name="dateone" class="tcal"  id="date" value=""/>
 <script language="Javascript"> new tcal({'formname':'form',
'controlname':'dateone'});</script>
 </td>
 </tr>
</div>
</form>
</body>
</html>

 Download

How To Display Current Time Using JS

JS

<script type="text/javascript">
function DisplayTime(){
if (!document.all && !document.getElementById)
return
timeElement=document.getElementById? document
.getElementById("curTime"): document.all.tick2
var CurrentDate=new Date()
var hours=CurrentDate.getHours()
var minutes=CurrentDate.getMinutes()
var seconds=CurrentDate.getSeconds()
var DayNight="PM"
if (hours<12) DayNight="AM";
if (hours>12) hours=hours-12;
if (hours==0) hours=12;
if (minutes<=9) minutes="0"+minutes;
if (seconds<=9) seconds="0"+seconds;
var currentTime=hours+":"+minutes+":"+seconds+" "+DayNight;
timeElement.innerHTML="<font style='font-family:verdana,
 arial,tahoma;font-size:12px;color:#E25984; font-weight:bold;'>
"+currentTime+"</b>"
setTimeout("DisplayTime()",1000)
}
window.onload=DisplayTime
</script>

CSS

<style type="text/css">
.datewidget 
{ 
    font-size: 11px; 
    color: #999; 
    padding: 5px 10px;
    width:100px;
    border:1px solid #CCC;
}
</style>

Source Code

<div class="datewidget">  
       <p ><span id=curTime></span></p>
  </div>

Shake Image

Advatages of POST &GET Methods.

GET method (VISIBLE).

It is possible to bookmark the page.Because variables are displayed in the URL.

POST method(INVISIBLE).

Variables are not displayed in URL.Not possible to bookmark the page.

Source Code

<div bgcolor="#FFFFCC">
<h1 align="center"><i id="h">Shake Image</i></h1>
<div align="left" style="height:160; width:250;"> 
<ul style="list-style-type:none; display:inline;">
<li><img src="image/cute.gif" class="shakeimage" onMouseover="init(this)

;rattleimage()" onMouseout="stoprattle(this);top.focus()" 

onClick="top.focus()"><h2 id="s">Advatages of POST &GET Methods. 

</h2></li></ul></div>
<div align="center"  style="height:160; width:550;">  
<ul style="list-style-type:none; display:inline;">
<li><img src="image/cute.gif"  class="shakeimage" onMouseover= 

"init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" 

 onClick="top.focus()"><h3 id="s">GET method (VISIBLE).</h3><h4 id="sa">

 It is possible to bookmark the page.Because values are displayed

 in the URL.</h4> </li></ul></div>
<div align="right"  style="height:160; width:750;">
<ul style="list-style-type:none; display:inline;">
<li><img src="image/cute.gif"  class="shakeimage" onMouseover= 

"init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" 

 onClick="top.focus()"><h3 id="s">POST method(INVISIBLE).</h3> 

<h4 id="sa">Values are not displayed in URL.Not possible 

to bookmark the page.</h4></li>
</ul>
</div>
</div>

Download

Photo Upload

Source Code

<div class="main"> 

<form action="" method="post" enctype="multipart/form-data"> 

 <div class="tab">
<div align="center"><p><span id="b" ><i>PHOTO UPLOAD<
/i></span></p>
<p>Filename:
    <input type="file" name="photo" id="file"
  size="18"/></span>
 Caption:     
      <input type="text" name="caption" value="" required="required"/>
     <input type="submit" name="submit" value="Submit" 
class="submit" /></span>
  </p>

</div>
<div align="center"><h2><?php echo $err; ?
></h2></div>
<br />
<br />
    <div class="tab1">
    <ul class="ul">
    <?php
    $select=mysql_query("select*from photo");
    while($row=mysql_fetch_array($select))
    {
    $name=$row['name'];
    $size=$row['size'];
    $type=$row['type'];
    $temp=$row['image'];
    $caption1=$row['caption'];
    $id=$row['id'];
    ?>
    <li>
    <div class="img">
    <p align="center"><span id="io"><img src="upload/<?php 
echo $name;?>" width="200" height="200" alt="<?php echo $name;?>"/>
    </span></p>
    <p align="center"><?php echo $caption1;?></p>
    <p align="center"><a href="uedit.php?id=<?php echo $id;?>"><span
 id="a">&nbsp;&nbsp;Edit&nbsp;&nbsp;</span></a>
    <a href="udelete.php?id=<?php echo $id;?>" onclick="return confirm('Really
 Do You Want To Delete This Image');">
    <span id="a">&nbsp;&nbsp;Delete&nbsp;&nbsp;</span></a>
    </p>
    </div>
    </li>
<?php } ?> </ul> </div> 

</form> </div>

Download

Pages(menu)

Date Function with Calender Icon

Source Code:

How To Display Current Time Using JS

JS

CSS

Source Code

Shake Image

Source Code

Photo Upload

Source Code