Posts

Showing posts with the label javascript

Loops in Javascript | what is loops? | Javascript 2020

Image
 Loops in Javascript Loops In Javascript | Loop Statements is use to create a loop. Basically in Programming loop mean the repeatation of statements. So basically loop statements in Javascript is use to make the statement repeat.  What is the use of Loops?  Loops basically use to repeat a statement. For example, if we got task that print "hello world" 100 time, instant of typing "hello world" 100 we will simply use loop and we will write the statement only one type. There are many uses of loops like initialization of data for array etc.  While Loop While loop is the type of loop which is use to repeat the statement on the basis of condition. While loop will stop only if its condition is false otherwise it will be an infinity loop. For example if we want to print 100 pages on printer  only if the pages is save if not it will be terminated.  Syntax while(condition) { Block of Statements }  In the above syntax if the condition is true the block of statem...

get current date and time in Javascript | Javascript 2020

 How to get current date and time in Javascript We can access date and time most of the language. So how we will get the current date and time? What are the statements use for it? So lets begin. 1. You must know about javascript  To get the current date and time through javascript you must have a little knowledge about javascript language. Basically javascript is a side scripting language use to make websites more dynamic. So you must know about it.  2. Lets start with date  Date inside the javascript is an object which returns a lot of information about date and time such as seconds, minutes etc. To use it we must create an object of date and we will store it in the Variable. See below to understand it clearly.  var date = new Date()  3. What we can access from Date() object?  We can access the following things from Date() object.  Milliseconds  Seconds  Minutes  Hours  Days  Weeks  Months  Years  4. How t...

Create slote machine game using Javascript and Html

Image
 Create slot  machine game using Javascript and Html In this post we will create a simple slot machine game using  javascript and Html. How it work Simple slot machine game created with javascript and html. It work base on the random number generator and We set time Interval It will give you 100 coin at the begining  At each roll it will cut 10 coin from yours coin If all the number are same then you will get 100 coin If the numbers are not same then you will get the fail message Enjoy the game rate my game out of 10. If you have any problem regarding to any thing in javascript and html  or you have some ideas then tell us in the command box. Here is the code <! DOCTYPE   html > < html > < head > < title ></ title > < style   type = "text/css" > .game-area  { padding  : 10px ; margin  : 5px ; background  :transparent ; box-shadow  : 0   0   8px   8px  rgba( 0 , 0 , 0 ...

How to create html online Editor in blogger

 How to create html online Editor in blogger To put the online editor in your blog follow these step: 1.First create a page 2.Then change the compose view to html view and past the code <! DOCTYPE   html > < html > < head > < title ></ title > < style   type = "text/css" > .text { width  : 100% ; height  : 500px ; overflow  :scroll ; color  :#6463d7; } .iframe { width  : 100% ; height  : 500px ; overflow  :scroll ; } </ style > </ head > < body > < textarea    contenteditable = "true"   id = "div"   class = "text" ><! DOCTYPE   html > < html > < head > < title ></ title > </ head > < body > </ body > </ html ></ textarea > < button   onclick = " res(); "   class = "btn" > Result </ button > < iframe   src = ""   id = "iframe"   class = "iframe" ...

How to create color generator with html and javascript

Image
 How to create color generator with html and javascript Color generator will generate hexadecimal code and rgb code . User can create any type of color through it. So lets begin. Here is the code < html > < head > < style   type = "text/css" > #colored { width : 300px ; height  : 100px ; border : 1px  solid #ddd ; } </ style > </ head > < body > < div   id = "colored" ></ div > < p > Red </ p > < input   oninput = " getColor() "   id = "red"   type = "range"   max = "255"   min = "0"   step = "1"   value = "30" > < p > Green </ p > < input   oninput = " getColor() " id = "green"   type = "range"   max = "255"   min = "0"   step = "1"   value = "30" > < p > Blue  </ p > < input   oninput = " getColor() " id = "blue...

How to create a responsive accordion with html and css

Image
 How to create a responsive accordion with html and css Accordions are useful when you want to toggle between hiding and showing large amount of content. We will create accordion with very simple and easy way. Here is the code <! DOCTYPE   html > < html > < head > < style > button.accordion  {      background-color : #cb4d4d;      color : #fff;      cursor : pointer;      padding :  18px ;      width :  100% ;      border : none;      text-align : left;      outline : none;      font-size :  15px ;      transition :  0.4s ; } button.accordion.active , button.accordion:hover  {      background-color : #7d1e1e; } button.accordion:after  { /* Unicode character...

how to create a progress bar with html and javascript

Image
 how to create a progress bar with html and javascript  So today in this tutorial we are going to create a responsive  progress bar with html and javascript and will add some css to look more responsive. It will show a filling bar and percentage  inside the filling bar. When we click on the download button the progress bar will start to progress. Here is the code <! DOCTYPE   html > < html > < head > < style   type = "text/css" > .progressBar   { width  : 340px ; height : 25px ; border  : 1px  solid #ddd ; border-radius  : 10px ; } .bar { width  : 0% ; height  : 25px ; background  :#d32f2f ; line-height : 25px  ; text-align  :center; color  :#fff; border-radius  : 10px  ; } .btn { width  : 100px ; height  : 40px ; border-radius  : 10px ; background  :#ddd; border  : 0 ; outline  : 0 ; } .btn:active  { box-shadow  : ...

How to create visitor counter using html and javascript

Image
Simple visitor counter with html and javascript This will help you to count your daily and monthly visitors. actually it is fake but it is very good to impress the visitors. if you want to add it into your blog then follow the step. 1. Open blogger dashboard and click on layout. 2.After clicking on layout , and then click on add widget. 3.then select html and javascript widget and past the following co de. Here is the code <! DOCTYPE   html > < html > < head > < title ></ title > < style   type = "text/css" > .box { width  : 90% ; margin  : 10px ; display  :inline-block; } .title { color  :#222 ; font-weight  :lighter; padding  : 5px  ; } .link { color  :#3764a3; font-weight  :normal; padding  : 5px  ; text-decoration  :none; } .text { padding  : 5px  ; font-size  :xx-large; font-family :Courier new,monospace; } .new { padding  : 2px   2px   2...