Tuesday, 17 February 2015

Learn JavaScript Project : Slide Show

Download Project Files Complete


<html>
<head>
<title>Slide Show</title>
<style>
html,body{
margin: 0;
padding: 0;
}
img{
width: 600px;
height: 400px;
}
#picbox{
border: 5px solid red;
margin: 0 auto;
width: 600px;
height: 400px;
}
#header
{
text-align: center;
text-transform: uppercase;
margin-bottom: 60px;
color: blue;
padding-top: 20px;
}
</style>
</head>
<body>
<div id="header">
<h1>Slide Show</h1>
<p>This is final project of lesson 1</p>
</div>
<div id="picbox"><img src="main.jpg" id="pictureBox"></div>

<script>

var imageBox = document.getElementById("pictureBox");

var imageList = ["image1.jpg" , "image2.jpg" , "image3.jpg"];

var i = 0;

function startSlides () {

imageBox.setAttribute("src" , imageList[i]);
i++;

if (i >= 3) {
i = 0;
};
}

setInterval(startSlides , 3000);


// see video tutorial if images are not working properly
</script>
</body>
</html>


Saturday, 7 February 2015

CS 301 Handouts with Bookmarks

CS101 Handouts with Bookmarks

CS 101 Assignment Solution 3 2015


<html>
<head>
<title>Cs 101 Assignment 3</title>
<style>
html , body {
margin: 0;
padding: 0;
background-color: white;
}
body{
width: 800px;
height: 1000px;
margin: 0 auto;
background-color: cyan;
}
h1{
background-color: blue;
}
#title{
background-color: blue;
}
h1{
text-align: center;
}
</style>
<script>

function tempConverter(){

var input = document.myform.fh.value;

var output1 = (input - 32) * 5/9;

var output2 = (input - 32) * 5 / 9 + 273.15;

var check = document.myform.fh.value;

if (input) {

document.myform.cels.value = output1;

document.myform.kelv.value = output2;
}
}

</script>
</head>
<body>
<h1>Pakistan Metrological Department</h1>
<p id="title">You are welcome to online temperature converter. Here is a simple Fahrenheit temprature converter. You can enter Fahrenheit values and get converted values into Celsius and Kelvin as per your requrement</p>

<form name="myform" method="post" >
 <table>
  <tr>
    <td>Farenheit :</td>
    <td><input type="text" name="fh" id="fh" size="15"></td>
  </tr>
  <tr>
    <td>Celsius :</td>
    <td><input type="text" name="cels" id="cels" size="15"></td>
  </tr>
  <tr>
    <td>Kelvin :</td>
    <td><input type="text" name="kelv" id="kelv" size="15"></td>
  </tr>
  <tr>
  <td></td>
    <td colspan="2" align="left"><input type="button" value="Convert" onCLick = tempConverter();>
    <input type="reset" value="Reset Form">
    </td>
  </tr>
</table>
<p>To clear your form for new conversion you can press the &quotReset Form&quot button and all values will be erased from fields</p>
</form>
</body>
</html>