October 10, 2015papeelise

Week Three

This week we learned about jQuery. jQuery is not a language, but it coding. As stated on the official website,

“it is a fast and concise JavaScript  Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.”

I have not had a chance to use any of my new coding schools in school. Hopefully second semester, I can show them off in my second year of computer programming. On my website this week I am going to add, jQuery selector, jQuery Hide/Show and jQuery Slide.

Here in an example of my jQuery Code for today,


<!DOCTYPE html>

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!-- Step 1 -->

<h2> Elise Pape </h2>

 Paragraph One 

 Paragraph Two 

<button id="button1"> Click ME! </button> <!--mouse over-->
<!slider>

<div id="flip"> Click to slide down panel </div>

<div id="panel"> Hello World! </div>

 <!--animation-->
<button id="bt1">Start Animation </button>

<div id="div1" style="background:#98bf21;height:100px;width:100px; position:absolute;"></div>

 </body>
</html>



$(document).ready(function(){
$("#button1").click(function(){
$(this).hide ();
});
});
$(document).ready(function(){
$("#p1").mouseenter (function(){
alert ("You Entered P1");
});
});
$(document).ready(function(){
$("#flip").click(function(){
$("#panel").slideDown("Slow");
});
});
$(document).ready(function(){
$("#bt1").click(function(){
console.log("clicked");
$("#div1").animate({left:'250px'});
});
}); 

Have a fabulous Saturday!

2 comments

Leave a comment