css – Display the current date and time using HTML and Javascript with scrollable effects in hta application

css – Display the current date and time using HTML and Javascript with scrollable effects in hta application

Method 1:


With marquee tag.

HTML

<marquee behavior=scroll bgcolor=yellow loop=-1 width=30%>
   <i>
      <font color=blue>
        Todays date is : 
        <strong>
         <span id=time></span>
        </strong>           
      </font>
   </i>
</marquee> 

JS

var today = new Date();
document.getElementById(time).innerHTML=today;

Fiddle demo here


Method 2:


Without marquee tag and with CSS.

HTML

<p class=marquee>
    <span id=dtText></span>
</p>

CSS

.marquee {
   width: 350px;
   margin: 0 auto;
   background:yellow;
   white-space: nowrap;
   overflow: hidden;
   box-sizing: border-box;
   color:blue;
   font-size:18px;
}

.marquee span {
   display: inline-block;
   padding-left: 100%;
   text-indent: 0;
   animation: marquee 15s linear infinite;
}

.marquee span:hover {
    animation-play-state: paused
}

@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}

JS

var today = new Date();
document.getElementById(dtText).innerHTML=today;

Fiddle demo here

This will help you.

Javascript

debugger;
var today = new Date();
document.getElementById(date).innerHTML = today

Fiddle Demo

css – Display the current date and time using HTML and Javascript with scrollable effects in hta application

<script>
    var today = new Date;
    document.getElementById(date).innerHTML= today.toDateString();
</script>

Leave a Reply

Your email address will not be published. Required fields are marked *