Day 6 and 7: Coding Dojo

15.10.13 / Coding Dojo / Author:
Tags: , , ,

Day 6 and 7 we have been learning about jQuery which so far is pretty awesome and not too hard.  I am working on the intermediate assignment at the moment. The first part of that I had to place 8 images on a webpage where as you click each image it disappears and there is a button that you can click and they all reappear. I did this by using $(this).fadeOut(‘slow’) on $(‘img’).click(function() and for the button I used $(‘img’).fadeIn(‘slow’) on $(‘button’).click(function(). Since  there is only one button and img I was able to just use ‘button’ or ‘img’ but I would drill down better if there were more on that page. I did have one issue where I totally did not put the http: from the google api link! Now I know to always check that!

The second part of the assignment was way harder and took me awhile, I had to ask for help on this part. The second part we had to create a form with two date selections and a button that displayed the results. For this I ended up doing the following jScript:

$(‘#date’).submit(function() {
console.log($(“#from”).val());
$(“#result”).html(“Your information:<br>From: ” + $(“#from”).val() + “<br>To: “+ $(“#to”).val());
$(‘#result’).css(‘border’, ‘2px solid black’)
$(‘#result’).css(‘margin-bottom’, ’30px’)
$(‘#result’).css(‘background-color’, ‘green’)

This just takes the To and From inputs and putting them in my empty div result and the rest is adding css once the submit button I have is submitted

The next part is sorting and then replacing images which I am working on tonight.

I am still amazed at how fast I can write out HTML and CSS now, and so excited when I work on a new assignment and just quickly type out the code.

Comments: 0

« | »