Video :
Friday, September 24, 2021
Big Cedar Tree | Olympic national park | Washington
Big Cedar Tree is located at Fork, Jefferson County, Washington. If you visit Kalaloch beach, it is near by and with in short walk you will find this tree . Also there is hike which is kid friendly. This tree believed to be 1000 years old . It used to stand over 175 feet tall unfortunately due to storm in March 2014 split the behemoth nearly in half :
Tuesday, July 6, 2021
Ecola State Park is located in clatsop county in Oregon state on oragon coastine.Itencompasses 14 km of coastline. It is betweek the famous Canon beach and Seaside.This area is significantly historiacal, asin 1806Captain William Clark and 12 members of the Corps of Discovery traveled trough this part of oregon coast. There is picnic place facilited with picnic tables, restrooms and also a nice big picnic shelter on top with fire place and plent of benches. The road from the entarnce of the state park tothe picnic place is very majestic, covered with spruce trees on tboth the sides of the road. Indian Beach is next to this spot. There are five diffrent kind of hiking trails depending on length and elevation. The state park is approx 1158 feet above sea level so it usualy windy whenever you visit. If anyonedon't want to hike that its view from few steps from parking lot itself is breathtaking. With few steps steep walking left from the picnic spot you will find scinic view of the Haystack Roack and few steps to te right you will see the Tillamook lighthouse. Visitors can visit Indian Beach also.
Friday, December 25, 2020
Lotto App|Random Number App|Javascript app
Random Number App: In this tutorial you will make app similar to Lottery or pick 3 number app. It is fun way to make app . You will use HTML, CSS and JavaScript . In JavaScript you will use Random generator and DOM (Document Object Model). How these topics go to gather and by using Event what you make. Here is source code and video for it.
Video:
Source Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lotto</title>
<style>
#container{
height: 300px;
width: 300px;
border: solid 2px black;
text-align: center;
}
input{
background-color: blue;
color: white;
height: 70px;
width: 70px;
text-align: center;
font-size: 30px;
font-weight: bold;
}
button{
height: 30px;
width: 70px;
margin-top: 20px;
background-color: teal;
border-radius: 20px;
color: white;
font-size: 15px;
font-weight: bold;
}
</style>
</head>
<body>
<div id="container">
<h1>Lotto Game:</h1>
<input type="text" id ="one">
<input type="text" id ="two">
<input type="text" id ="three"><br>
<button id ="submit">Click</button>
</div>
<script>
var randone= document.querySelector("#one")
var randtwo= document.querySelector("#two")
var randthree= document.getElementById("three")
var submit =document.getElementById("submit")
submit.addEventListener("click", function(){
numberone();
numbertwo();
numberthree();
})
function numberone(){
randone.value= Math.floor(Math.random()*10)
}
function numbertwo(){
randtwo.value= Math.floor(Math.random()*10)
}
function numberthree(){
randthree.value= Math.floor(Math.random()*10)
}
</script>
</body>
</html>
Saturday, November 21, 2020
How to create simple Quiz app in Javascript?
Quiz App in Javascript:
In this tutorial you will learn HTML, CSS, BootStrap and Java library -Jquery. This is fun way to learn these topics by making app.You will learn how to use show, hide and toggle function by making cool app. Video and Source code are included so make and show to world.
Video:
SourceCode:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Quiz Application</title>
<style>
#container{
height: 500px;
width: 500px;
background-color: dodgerblue;
margin-left: 20px;
text-align: center;
border: 2px solid black;
color: white;
}
p{
color:yellow;
}
</style>
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
crossorigin="anonymous">
</head>
<body>
<div id ="container">
<h1> Quiz App</h1>
<h3>1. Tallest Mountin in the world?</h3>
<p>Mount Averest</p>
<h3>2. Deepest ocean the world?</h3>
<p>Pacefic</p>
<h3>3. Longest River in the world?</h3>
<p>Nile</p>
<!-- <button id ="hid"class="btn btn-danger">Hide</button>
<button id ="sho"class="btn btn-warning">Show</button> -->
<button id ="tog"class="btn btn-dark">Hide|Show</button>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
crossorigin="anonymous"></script>
<script>
$(document).ready(function(){
// $("#hid").click(function(){
// $("p").hide();
// })
// $("#sho").click(function(){
// $("p").show();
// })
$("#tog").click(function(){
$("p").toggle();
})
})
</script>
</body>
</html>
Easy Javascript App for beginner | Feet to Inch App
JavaScript App for Beginner: In this tutorial you will learn HTML, CSS, Bootstrap, JavaScript function, event, DOM, Validation , if else statement and many more by creating app . It is learn with fun activity . you will learn how to create Feet to Inch conversion. so make it and show to world. Below you will find video and source code for App.
lets understand one by one. First lets create HTML Document
h1tag contains title, now add two input tag and set type as text . now we will add one button . That's what we need for html . now we since we will add CSS in future so lets wrap all html in div and give id as container. we will add id to input tag also . For error message lets give h3 tag and add span tag for future error message. for coloring button we will give id to button tag also.
<div id ="container">
<h1>Feet to Inch Convertor App</h1>
Feet:<input id ="fee"type ="text">
<h3><span id = "err"></span></h3>
Inch:<input id ="inc"type ="text"><br><br>
<button id="sub"class="btn btn-dark">Convert</button>
</div>
now we can create style tag after title in html.
we can do this multiple way . best way is do it via creating separate file and link it.
for Simplicity purpose we have created style tag in same file . Since we gave id
for container so we will use hashtag for container and we will set height , width color
etc. Now our CSS is also ready .
CSS
<style>
#container{
height:400px ;
width:200px ;
background-color: coral;
text-align: center;
color:white;
border:2px solid brown;
margin-top: 100px;
margin-left: 100px;
}
#err{
color:red;
}
</style>
Now time to introduce JavaScript.
feet=document.getElementById("fee");
Now lets locate out element. document.getElement will find our element. since we use
id as fee in our HTML . Now we will store in feet variable .
lets do it for another input tag and submit button .
inch=document.getElementById("inc");
inch=document.getElementById("inc");
submit=document.getElementById("sub");
error=document.getElementById("err");
Since we have added our submit butoon in variable we can add even listener on it. so we
create function when someone click on button our function will run. we will add if else
statement . if value of feet is empty, we will through error message and we have provide
error message text as "Invalid, can not empty!". If user enter any content in input field
it will run else block of code. we will clear error message first. and will provide
formula which will convert value accurately.
For more information we have added video tutorial step by step so you can watch it also.
in this video tutorial you will learn about HTML, CSS, Bootstrap. JavaScript is very important
we have covered datatype variable how to use it, Function, if else statement, Document Object Model (DOM)
by adding and fetching id and store in variable. now you can create many app just need to change formula accordingly .
submit.addEventListener("click", function(){
if(feet.value===""){
error.textContent= "Invalid, can not empty!"
}
else{
error.textContent ="";
inch.value=feet.value*12;
}
})
Video
Source-code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FeettoInch Convertor</title>
<style>
#container{
height:400px ;
width:200px ;
background-color: coral;
text-align: center;
color:white;
border:2px solid brown;
margin-top: 100px;
margin-left: 100px;
}
#err{
color:red;
}
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/
css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
crossorigin="anonymous">
</head>
<body>
<div id ="container">
<h1>Feet to Inch Convertor App</h1>
Feet:<input id ="fee"type ="text">
<h3><span id = "err"></span></h3>
Inch:<input id ="inc"type ="text"><br><br>
<button id="sub"class="btn btn-dark">Convert</button>
</div>
<script>
feet=document.getElementById("fee");
inch=document.getElementById("inc");
submit=document.getElementById("sub");
error=document.getElementById("err");
submit.addEventListener("click", function(){
if(feet.value===""){
error.textContent= "Invalid, can not empty!"
}
else{
error.textContent ="";
inch.value=feet.value*12;
}
})
</script>
</body>
</html>
how to create Simple Javascript App?
LBToKGConverterApp-Javascript:
In this lesson you will learn how to create LB TO KG converter with validation. you will learn HTML, CSS, Bootstrap and in Javascript you will learn function, event if else and many more. Please click on video to watch. You can modify css and Bootstrap. Design may not be ideal here because purpose is to show topics .
video
Soruce Code:
<html lang="en">
<head>
<meta charset="UTF-8"></meta>
<meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>
<title>LB To KG Calculator</title>
<style>
#container{
height: 350px;
width: 200px;
background-color:gray;
border: 2px solid black;
text-align: center;
margin-top: 100px;;
margin-left: 225px;
}
#error{
color: red;
}
</style>
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" rel="stylesheet"></link>
</head>
<body>
<div id="container">
<h1>LB to KG Calculator</h1>
<h3><span id="error"></span></h3>
LB:<input id="lb" type="text" />
KG:<input id="kg" type="text" /><br /><br />
<button class="btn btn-warning" id="submit" type="button">Submit</button>
</div>
<script>
lb =document.getElementById("lb");
kg =document.getElementById("kg");
error =document.getElementById("error");
submit =document.getElementById("submit");
submit.addEventListener("click", function(){
if(lb.value ==""){
error.innerText ="Please Enter Valid Number"
} else{
error.innerText="";
kg.value=lb.value/2.20462262;
}
})
</script>
</body>
</html>
LB to KG Calculator
LB: KG:
Sunday, September 27, 2020
US Naturalization Practice Test| US Citizen/ Naturalization Practice Quiz
US Naturalization Practice Test
We have created user friendly US Naturalization practice test, which help you to prepare for US citizenship/naturalization test.
We have covered topics like history, government, war, george. This is multiple choice naturalization practice test, where only one answer is correct out of four choices.
Subscribe to:
Posts (Atom)
java switch statement | Java Tutorial For Beginners
Switch statement is alternative and more cleaner way to write code if we have more than two options. we can use else if, this is better way...
-
**Privacy Policy** Guruji Guru built the General Knowledge Quiz app as a Free app. This SERVICE is provided by Guruji Guru at no cost and is...
-
Javascript for Beginners sourceCode- 1. Print 0 to 10 by using for loop and while loop IF you want to print 0 to 1o in descending order...
-
Random Number App: In this tutorial you will make app similar to Lottery or pick 3 number app. It is fun way to make app . You will use HT...
