Skip to content

PHENOMENA of LIGHT #53

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
bhawna-singh wants to merge 4 commits into
base: master
Choose a base branch
from
Open

PHENOMENA of LIGHT #53

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0d89378
added a chapter on light
bhawna-singh Jan 12, 2019
3742f34
changed with new animations
bhawna-singh Jan 16, 2019
5a65245
new commit
bhawna-singh Feb 9, 2019
3b0bb10
final commit
bhawna-singh Feb 11, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -209,11 +209,16 @@ <h1>States of matter</h1>
</div>
</div>
<div class="row">
<div class="col-md-12 portfolio-item sound">
<div class="col-md-4 portfolio-item sound">
<a href="groups_periods/index.html">
<h1>Groups And Periods</h1>
</a>
</div>
<div class="col-md-4 portfolio-item modification">
<a href="light/lesson.html">
<h1>Light</h1>
</a>
</div>
</div>
<div class="row">
<br/>
Expand Down
Binary file added light/JSz.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/Refraction.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/diffraction.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif.mp4
View file
Open in desktop
Binary file not shown.
Binary file added light/gif1.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif2.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif3.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif4.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif5.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/gif6.mp4
View file
Open in desktop
Binary file not shown.
194 changes: 194 additions & 0 deletions light/lesson.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,194 @@
<!DOCTYPE html>
<html>

<head>
<script src="scripts/d3.v2.js"></script>


<meta charset="utf-8">
<link href="../css/bootstrap.css" rel="stylesheet">
<link href="../css/lesson_template.css" rel="stylesheet">
<link href="modification.css" rel="stylesheet">
<!-- <link href='reflection.jpg'>
<link href='refraction.jpg'>
<link href='diffraction.png'> -->
</head>

<body>


<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">

<li>
<a href="../index.html">Home</a>
</li>

<li>
<a href="../navigation.html">All lessons</a>
</li>
</ul>

</div>
</nav>


<div class="fond" id="smoothscroll">
<div id="forb" style="float:left;" class="style_prevu_kit">
</div>
<div id="button" style="float:left;" class="button-flip">
<a id="button" class="active" href="#text">
<button style="color: #fff; margin-top: 50px;" type="button" class="btn" href="#text">More info</button>
</a>
</div>
<div id="forb" style="float:right;" class="style_prevu_kit">
</div>
</div>

<section id="visual">
<br>
<!-- <div class="buttons">
<button id="reflection" onclick="changeState(500)">LIGHT</button> -->
<!-- <button id="refraction" onclick="changeState(200)">REFRACTION</button>
<button id="diffraction" onclick="changeState(50)">DIFFRACTION</button> -->
</div>
<br><br><br><br>
<!-- <div class="container">
<div class="row">
<div class=" col-xs-12 col-sm-12 col-md-12 col-lg-12">
<div class="fadein" style="height:43vw; text-align: center; width:100%">

<video id="f2" src="gif.mp4" controls autoplay >
<video id="f1" src="reflectionjif.mp4" controls autoplay>
</div>
</div>
</div> -->

<!-- <canvas id="myCanvas" width="1000" height="1000" style="border:0px solid #000000;">

</canvas> -->
<!-- <style>
canvas {
padding-left: 0;
padding-right: 0;
margin-left: auto;
margin-right: auto;
display: block;
width: 800px;
}
</style> -->
<br><br><br><br>



<div class="container">
<div class="row">



<div class=" col-xs-12 col-sm-12 col-md-12 col-lg-12">
<img src="gif1.gif" style="margin-top: 0% ; margin-left: 15% ;margin-right: 0% ;margin-bottom: 0%;height: 450px; width: 750px">
<br>
<h1 style="margin-left: 27% ; color:#fff ; ">Fig.Polarization in Light</h1>

</div>
</div>
</div>



</section>
<!--
<section id="text" style="color: white ; background-color : #39454A">


<h1> Comparison chart of reflection,refraction and diffraction </h1>

<table border="0" align="center" class="table" >

<tr>
<th scope="col"> </th>
<th scope="col" > Reflection </th>
<th scope="col"> Refraction </th>
<th scope="col"> Diffraction </th>
</tr>

<tr>
<th scope="row" style=" font-size : 25px">
<span id="text-1" >Definition</span>
</td>
<td> Reflection is the phenomenon wherein a beam of light incident on an object bounces off, i.e., reflects of its surface. </td>
<td>Refraction occurs when light passes from one medium into another one with a different density. </td>
<td> Phenomenon where a single beam of light, when passed through a narrow slit, was able to split into different directions creating an interference pattern. </td>
</tr>
<tr>
<th scope="row" style=" font-size : 25px">
<span id="text-2">Medium</span>
</td>
<td> Can take place in same medium </td>
<td> Change of medium is required </td>
<td> Can take place in same medium </td>
</tr>
<tr>
<th scope="row" style=" font-size : 25px">
<span id="text-3" >Laws</span>
</td>
<td> Angle of incidence is equal to the angle of reflection </td>
<td> Snell's Law is valid </td>
<td> Specific equations are valid for calculating conditions and positions of interference bands. </td>
</tr>
<tr>
<th scope="row" style=" font-size : 25px">
<span id="text-1" >Calculations</span>
</td>
<td> theta i=theta r </td>
<td> n1/n2=sin (theta1)/sin (theta2) </td>
<td>a * λ = d * sin(Θₐ) </td>
</tr>
</table>

</section> -->
<section id="text" style="width: 100%">
<div>
<h1>Light and it's Dual Nature</h1>

<p>
<span id="text-1">Definition of light</span>
</p>

<p>Light is electromagnetic radiation within a certain portion of the electromagnetic spectrum. The word usually refers to visible light, which is the visible spectrum that is visible to the human eye and is responsible for the sense of sight.</p>

<p>Light exhibits the following properties and phenomena</p>

<p>
<span id="text-2">Wave or stream of particles</span>
</p>

<p> In some of the experiments light exhibits properties that prove the wave nature of light. Whereas in some other experiments, the observations reveal that light is a stream of particles travelling from one place to another. But now scientists have explained that because of its dual nature light can be considered as particle in some cases and as a wave in some other cases </p>

<p>
<span id="text-3">Characteristics of wave nature of light</span>
</p>

<p>Wavelength -distance between two consecutive crests/troughs ,Frequency -number of waves passing through a point per second ,Interference -overlapping of two or more light waves ,Diffraction -spreading of light waves when it passes though the corners of an object </p>

<p>Diffusion in liquids is slower than in gases because the particles in a liquid move more slowly.</p>

<p>
<span id="text-1">Other Phenomena</span>
</p>


<p>Reflection -bouncing off of light from an object ,Refraction -bending of a wave on change of medium ,Scattering -redirection of light in many different directions when it interacts with matter ,Polarization -When the electric field vectors are restricted to a single plane by filtration, then the light is said to be polarized with respect to the direction of propagation </p>
</div>

</section>

<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/smoothscroll.js"></script>

</body>

</html>
112 changes: 112 additions & 0 deletions light/modification.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
button#reflection {
background-color: #fff;
color: #E376C4;
border: none;
font-size: 1.2em;
font-family: 'Courier new', monospace, sans-serif;
font-weight: bold;
font-style: oblique;
}

button#refraction {
background-color: #fff;
color: #6EF5DE;
border: none;
font-size: 1.2em;
font-family: 'Courier new', monospace, sans-serif;
font-weight: bold;
font-style: oblique;
}

button#diffraction {
background-color: #fff;
color: #E7932E;
border: none;
font-size: 1.2em;
font-family: 'Courier new', monospace, sans-serif;
font-weight: bold;
font-style: oblique;
}


body {
padding: 2em;
border-top: none;
background-color:#999999;

}

table.table {
width: 100%;
border-top: none;
}

.table th,
.table td {
text-align: left;
padding: 0.25em;
}

.table tr {
border-bottom: none;
border-top: none;
}

.table > tbody > tr > th, {
padding: 8px;
line-height: 1.42857143;
vertical-align: top;
border-top: none;
}

td.edit-buttons {
text-align: right;
}

button {
border: none;
margin: 0 0.25em;
transition: all 0.3s;
}

button:hover {
box-shadow: 0 0 4px rgba(3, 3, 3, 0.8);
opacity: 0.9;
}

button.edit {
background: #6F9;
}

button.delete {
background: #F69;
}

@media screen and (max-width: 800px) {
tr {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0.5em 0;
border: none;
}
td,
th {
flex: 1 1 150px;
border: none;
}
td.edit-buttons,
td.empty {
/*flex: 1 0 90%;
text-align: center;*/
}
}

* {
box-model: border-box;
font-family: 'Space Mono';
}




Binary file added light/reflect.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/reflection.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/reflection1.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added light/reflectionjif.mp4
View file
Open in desktop
Binary file not shown.
16 changes: 9 additions & 7 deletions navigation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,16 +140,18 @@ <h1 style="text-align:left; color:#00ff00;">_Biology</h1>
</ul>
<li class="heading3" style="clear: both;">Levels of organisation</li>
<ul>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 1</li>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 2</li>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 3</li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Levels/Lesson1.html"> _Lesson 1</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Levels/Lesson2.html"> _Lesson 2</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Levels/Lesson3.html"> _Lesson 3</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Levels/Lesson4.html"> _Lesson 4</a></li>
</ul>
<li class="heading3" style="clear: both;">Movement across cell membranes</li>
<ul>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 1</li>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 2</li>
<li style="list-style-type: none; float: left; padding: 16px;"> _Lesson 3</li>
</ul>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Movement/Lesson1.html"> _Lesson 1</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Movement/Lesson2.html"> _Lesson 2</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Movement/Lesson3.html"> _Lesson 3</a></li>
<li style="list-style-type: none; float: left; padding: 16px;"><a href="Biology/Movement/Lesson4.html"> _Lesson 4</a></li>
</ul>
</ul>
</div>
<button class="heading2 accordion">Nutrition, digestion and excretion</button>
Expand Down