CS202 Assignment No 3 Solution Spring 2019 | Virtual Study Solutions

Menu

CS202 Assignment No 3 Solution Spring 2019

CS202 Assignment No 3 Spring 2019

Dear Students, Here you can read or Download CS202 - Fundamentals of Front End Development Assignment No 3 Solution and Discussion of Semester Spring 2019. Assignment Due Date is 19 July 2019. Total Marks are 20. We are here to facilitate your learning and we do not appreciate the idea of copying or replicating solutions. CS202 Assignment Solution File has been added. Previously we shared CS101 Assignment No 3 Solution Spring 2019.

cs202 assignment no 3 Solution and discussion Spring 2019

cs202 assignment no 3 Solution and discussion Spring 2019

CS202 Assignment Instructions:

Please read the following instructions carefully before submitting the assignment. It should be clear that your assignment will not get any credit if:

The assignment is submitted after the due date.

The submitted assignment does not open or file is corrupt.

The assignment is copied(partial or full) from any source (websites, forums, students, etc)

Please Note: You have to upload.html file which contains the required code. Assignment in any other format (extension) will not be accepted and will be awarded zero marks.

Also read: CS408 Assignment No 3 Solution Spring 2019

CS202 Assignment Objective:

The objective of this assignment is to provide hands-on experience of:

jQuery implementation

Event handling in jQuery

Apply CSS through jQuery

Also read: CS401 Assignment No 3 Solution Spring 2019

CS202 Assignment Guidelines:

The code should be properly indented.

You will use the only Notepad to make the HTML file

You will not use any other software to make .html file

Also read: CS408 Assignment No 3 Solution Spring 2019

CS202 Assignment Question:

Problem Statement:

You are required to write jquery code which will fulfill the requirements given below.

cs202 assignment no 3 Question Spring 2019

CS202 Assignment Requirements and Solution Instructions:

Watch the video given in the assignment folder and apply the jQuery.

Find the attached HTML Design file to put required jquery code in this file.

Click on the heading in the left nav bar highlights the clicked item and the related text should be displayed on the right side.

Implement all the actions as instructed using buttons according to the video file.

Tips:
The CSS of each element is implemented through ID. To access all required element through ID in jQuery.

CS202 Assignment No 3 Solution Spring 2019

You can see the Sample Preview of CS202 Assignment No 3 Solution provided by (Virtual Study Solutions) below. Click on Download Button to Download Solution File in Your PC. Please Share it with your friends. You can also like our Facebook Page or Subscribe Us below for Updates.

CS202 Assignment Solution Explanation Using Jquery or Ajax Call

CS202 Assignment No 3 Solution Sample Preview

Assignment Solution File Sample Code Preview has been added below with Solution File in .rar format which includes both .html + .docx file.

<!DOCTYPE html>
<html>
<head>
 <title>Front End Development- Assignmnet-03 Solution by Virtual Study Solutions</title>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <style>
body{
 font-family: Helvetica;
 margin: 0;
 padding: 0;
}
.intro {
  background-color: yellow;
 
}
 #header, #footer{
  background-color: #008CBA;
  color: white;
  text-align: center;
  width: 100%;
  float: left;
  height: 70px;

 }
 #nav{
  background-color: #e1e4e6;
  width: 25%;
  float: left;
  height: 440px;
 }
 #body{
  background-color: #fcfcfc;
  width: 75%;
  float: left;;
  height: 450;
 }
 .allText{
  font-size: 18px;
  color: black;
  padding: 20px;
  margin: 20px;
  background-color: #38ceff;
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
 }

 

 ul{
 list-style: none;
 }

 ul li a{
  text-decoration: none;
   padding: 20px;
   color: white;
  background-color: black;
  margin-bottom: 100px;

  font-style: italic;
  


 }

  
 ul li{
  margin-top: 40px;

 
    
 }
 #btn1, #btn2{
  background-color: white; 
    color: black; 
    border: 2px solid #008CBA;
  
   padding: 20px;
   margin: 20px;


 }
 #btn1:hover , #btn2:hover {
  background-color: #008CBA;
  color: white;
  transition: 1s;
}


</style>
<script>
$(document).ready(function(){
$("#test1").css("background-color", "yellow");
console.log("enter in script");
  $("#t1").click(function(){
  
 
    $("#text1").show();
 $("#text2").hide();
 $("#text3").hide();
 $("#text4").hide();
  });
 
 $("#t2").click(function(){
    $("#text1").hide();
 $("#text2").show();
 $("#text3").hide();
 $("#text4").hide();
  });
 
 $("#t3").click(function(){
    $("#text1").hide();
 $("#text2").hide();
 $("#text3").show();
 $("#text4").hide();
  });
 
 $("#t4").click(function(){
    $("#text1").hide();
 $("#text2").hide();
 $("#text3").hide();
 $("#text4").show();
  });
  
  $("#btn1").click(function(){
     $("#header").css("background-color", "yellow");
  });
  
  $("#btn2").click(function(){
  $("#footer").css("background-color", "yellow");
  });
  
});
</script>



</head>
<body>
 
<div id="header" class="t1"> 
 <h1>Virtual University of Pakistan</h1>
</div>
<div id="nav">
 <ul>
  <li id="t1" ><a style="background-color: #505152;" href="#">CHANCELLOR'S MESSAGE</a></li>
  <li id="t2"><a href="#">VISION</a></li>
  <li id="t3"><a href="#">Mission</a></li>
  <li id="t4"><a href="#">INTRODUCTION</a></li>
 </ul>
 
</div>
<div id="body">
 <div id="text1" class="allText">The importance of quality education for Socio-economic development of any country and nation cannot be over-emphasized. In addition to character building it provides the human capital necessary for research, innovation, growth, and national development. Moreover, inclusive and uniform access to higher education is also of pivotal importance to lead the country on the path of economic and technological development.

One of the major challenges being faced by the education sector of Pakistan is lack of qualified faculty vis-a-vis demand. Effective utilization of Information and Communication Technology (ICT) tools provide a practical solution to this issue while maintaining the highest and internationally acceptable education standards.

Virtual University of Pakistan is pioneer in the use of ICTs for imparting the quality education to its students all over the country including the remote areas and Pakistani overseas diaspora. With its highly flexible mode of education, Virtual University enables its students to manage studies at their own convenience and provides opportunities to harness their untapped talents.

Virtual University of Pakistan is playing its due role in promoting education in the country. I hope that the University will continue to ensure best quality in education and research.

I wish this institute success in the years ahead.

Dr. Arif Alvi 
President of the Islamic Republic of Pakistan/ 
Chancellor, Virtual University of Pakistan </div>

 <div id="text2" class="allText" style="display: none;" >To become an internationally acclaimed technology based university that improves access to higher education while maintaining the highest quality standards</div>

 <div id="text3" class="allText"  style="display: none;">To provide the highest quality of education and research opportunities to all aspiring students irrespective of their age, gender, religion, and geographical location by using modern ICT with content developed by top experts of their respective fields.<br>To train students to grow in their professional lives and inculcate an entrepreneurial mindset with high ethical and moral standards to become a productive part of society.<br>
 To provide the best working environment to faculty and staff to create a culture of research, innovation and cooperation.<br>
 To promote the philosophy of knowledge sharing by providing free and unhindered access to all of its educational content.</div>

 <div id="text4" class="allText"  style="display: none;">The University opened its virtual doors in 2002 and in a short span of time its outreach has reached over one hundred cities of the country with more than one hundred and ninety associated institutions providing infrastructure support to the students. Pakistani students residing overseas in several other countries of the region are also enrolled in the University's programs.</div>

<div>
 <button id="btn1">Highlight Header </button>
 <button id="btn2">Highlight Footer </button>
</div>

</div>



<div id="footer">
 <h1>Virtual University of Pakistan</h1>
</div>




</body>
</html>

CS202 Assignment No 3 Solution Download Link

Download [ Solution File Upload Status: Done ]

Jahanzaib Ahmed

Your number one source for Virtual University Assignments Solution, Mid-Term/Final-Term Papers, Quiz, GDB, Final Projects And Much More For VU Students. We’re dedicated to giving you the very best of Help, with a focus on three Features, ie Assignment Solutions, Past Papers and Final Projects.

Post a Comment

Subscribe to: Post Comments (Atom)

Top