Posts

Showing posts with the label Html

CSS animation.

CSS animation An animation is an element which changes its one style gradually to another style. You can change CSS property according to requirement. To use CSS animation, you must first specify some keyframes for the animation. The animation will gradually change from the style to the new style at certain times to get an animation you must bind the animation to an element. CSS animation properties: @keyframes animation-name animation-duration animation-delay animation-iteration-count animation-direction animation-timing-function animation-fill-mode animation <!DOCTYPE html> <html>     <head>         <style>             div             {                 width: 150px;   ...

get value from object in JavaScript

Image
How to get value from object in JavaScript? How to validate email in JavaScript? The form capture the following: visitors name. Email_Id gender/sex the visitors date of birth(dd/mm/yyyy) text box to retrieve the users hobbies submit/reset/abort button Client side validation: Name,email,sex,Dob con not be empty. The email address can not contain any special character except '@' and '.' the length of email and name field can not exceed 30 character date of birth is keyed in  "dd/mm/yyyy" formats and validate day, month and year. day is between 1 to 31, month is 1 to 12 and year is accept till 2020. Html/JavaScript <html>     <head><script  language="Javascript">         function verify()         {             let i;             for(i=0;i<7;i++)           ...

Decimal-hex-oct-binary

Image
Convert Decimal to Binary, Binary to Decimal, Decimal to O ctal , O ctal  to Decimal, Decimal to H ex , Hex  to Decimal

Get value from form using JavaScript.

Image
Using Text and Button object in HTML. Get  value from form using JavaScript. In this example we  create a form in which two object Text and Button, as first Text object is used to accept a mathematical expression for evaluation and second Object button is used to calculate the entered expression. When we Click this Button it Calculate the expression in shown in next Text box.                                       In script tags we create a function as named calculate in which we pass the form as argument/ reference of form.In block of function we simply use form.result.value=eval(form.entry.value) , where result and entry is name of  text object and eval is a method that is use  to convert the string expression to a numeric value. when this program is executed in a JavaScript is enabled browser,Enter an expression in the first Text object  on the form f...

How to get value of selected radio button using JavaScript ?

How to get value of selected radio button using JavaScript ? To get the vale of selected radio button,create a function that  function gets all the radio button using with the Name attribute and finds the radio button selected using checked property.The checked property  return true or false.If radio button is checked it returns true otherwise it returns false. If we use multiple radio button than each button has its own index value therefore we access  selected radio button using this index value.  After get value we display result in a box using innerHTML.  FOR EXAMPLE  THE FOLLOWING PROGRAM DISPLAY THE SELECTED RADIO BUTTON VALUE <html>     <body>         <input type= "radio" name= "gender" value= "male" >Male          <input type= "radio" name= "gender" value= "Female" >Female           <input type= "radio" n...

javaScript Calculator.

Image
javaScript Calculator. calculator using HTML,CSS and javaScrip t. Html code- <html>     <head>         <meta charset="utf-8">         <meta name="viewport" content="width=device-width, initial-scale=1.0">         <link rel="stylesheet" type="text/css" href="style_calculater.css">         <script src="script_src.js">     </head>     <body>     <div class="container">         <div class="dbox"><input type="text" id="display" placeholder="0"><br>         <input type="text" id="display2" placeholder="0">         <div id="box">             <button class="key" value="7" onclick="dis('7')" > 7 </button>              <butt...

digital clock

Image
The date object is a built-in JavaScript object that enables you to conveniently work with date and times.You can create a date object anytime you need to store a date.Date object is  created using new keyword. birthday= new Date(); birthday= new Date("june 20,2002 08:00:00"); birthday=new Date("6,20,2002");   Setting Date values. setDate()   set the date of month; setMonth()  set the month, month number is 0 to 11; setFullYear()  set full year. setTime()   set the  time. setHours(),setMinutes(),setSeconds()   set the time. Getting date values. getDate()   get the date of month; getMonth()  get the month, month number is 0 to 11; getFullYear()  get full year. getTime()   get the  time. getHours(),getMinutes(),getSeconds()   get the time. <html>     <head>     <style>         #circle   ...