Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>PHP is Server Side Language, it wont work in Client Side.. you are trying to display time i hope..</p> <pre><code>&lt;script&gt; $(document).ready(function() { // Create two variable with the names of the months and days in an array var monthNames = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]; var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"] // Create a newDate() object var newDate = new Date(); // Extract the current date from Date object newDate.setDate(newDate.getDate()); // Output the day, date, month and year $('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()] + ' ' + newDate.getFullYear()); setInterval( function() { // Create a newDate() object and extract the seconds of the current time on the visitor's var seconds = new Date().getSeconds(); // Add a leading zero to seconds value $("#sec").html(( seconds &lt; 10 ? "0" : "" ) + seconds); },1000); setInterval( function() { // Create a newDate() object and extract the minutes of the current time on the visitor's var minutes = new Date().getMinutes(); // Add a leading zero to the minutes value $("#min").html(( minutes &lt; 10 ? "0" : "" ) + minutes); },1000); setInterval( function() { // Create a newDate() object and extract the hours of the current time on the visitor's var hours = new Date().getHours(); // Add a leading zero to the hours value $("#hours").html(( hours &lt; 10 ? "0" : "" ) + hours); }, 1000); }); &lt;/script&gt; </code></pre> <p>CSS /<em>-----------------------------</em>/</p> <pre><code> .clock_home a{ font-size:18px; } a:hover,a:focus{ text-decoration: none!important; } .clock_home{ float:right; width: 300px; } .clock { height:25px; width: 260px; margin: 10px 20px auto auto; padding: 10px; border: 1px solid #eee; color: #0088CC; } #Date { font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif; font-size:16px; text-align: center; float: left; margin-right: 15px; /*text-shadow: 0 0 5px #00c6ff;*/ } .clock ul { margin: 0 auto; padding: 0px; list-style: none; } .clock ul li { display: inline; text-align: center; float:left; font-size:16px; font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif; /*text-shadow: 0 0 5px #00c6ff;*/ } #point { position: relative; -moz-animation: mymove 1s ease infinite; -webkit-animation: mymove 1s ease infinite; } /* Simple Animation */ @-webkit-keyframes mymove { 0% {opacity: 1.0; text-shadow: 0 0 20px #00c6ff; } 50% { opacity: 0; text-shadow: none; } 100% { opacity: 1.0; text-shadow: 0 0 20px #00c6ff; } } @-moz-keyframes mymove { 0% { opacity: 1.0; text-shadow: 0 0 20px #00c6ff; } 50% { opacity: 0; text-shadow: none; } 100% { opacity: 1.0; text-shadow: 0 0 20px #00c6ff; }; } </code></pre> <p>HTML</p> <pre><code> &lt;div class="clock"&gt; &lt;div id="Date"&gt;&lt;/div&gt; &lt;ul&gt; &lt;li id="hours"&gt;&lt;/li&gt; &lt;li id="point"&gt;:&lt;/li&gt; &lt;li id="min"&gt;&lt;/li&gt; &lt;li id="point"&gt;:&lt;/li&gt; &lt;li id="sec"&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload