Unit 2A question 4

by Ken Sprague

HTML

<h4>4. Write a function that will calculate the sum of the first 12 even
        Fibonacci numbers</h4>
      <p>Recall that the Fibonacci sequence is a series that begins with two
        integers: 0, 1. The next number in the sequence is derived by adding the
        previous two numbers, so the Fibonacci sequence looks like this: 0, 1,
        1, 2, 3, 5, 8, 13, 21, 34, ...&nbsp;</p>
      <p>The button below will run your function, called twelveEvenFibonacciSum()
        and print its result in the space provided. All you have to do is write
        the function, which accepts no arguments, and returns the sum of the
        first 12 even Fibonacci numbers. Your code will go in
        js/hw2TwelveEvenFib.js&nbsp;</p>
      <p>Hint: First you'll need a loop that generates Fibonacci numbers. You'll
        need a way to test each one for whether it's even or odd. And you'll
        need to sum up the even ones, counting them as you go.  Count zero as the
        first even number in the sequence.</p>
      <div id="sumFib" class="hwbutton">Get the Sum!</div>
      <br>
      The sum of the first 12 even Fibonacci numbers is: <span class="" id="sumFibResult"></span>
      <br>
      <br>

CSS

#studentname{
	border:1px solid darkgray;
	padding:.7em;
	background-color: gray;
	width:20%;
}

.namedata{
	color: maroon;
	font-weight:bold;
}

.degoutput{
	width:4em;
	border: 1px solid gray;
	padding: 1px;
}

#putAnX{
	width:600px;
	height:400px;
	border:1px solid black;
}
#theX{
	position:relative;
}
body {
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 14px;
	line-height: 1.428571429;
	color: #333;
}
.container {
	width: 80%;
	margin: auto;
}

h4 {
	border-top: 1px solid black;
	padding-top: 1em;
	width: 95%;
}

.button {
    text-indent:0;
    border:1px solid #eda933;
    display:inline-block;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    font-style:normal;
    height:65px;
    line-height:65px;
    padding: .5 em;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #cd8a15;
    background-color:#f6b33d;
}

.hwbutton {
	-moz-box-shadow:inset 0px 1px 0px 0px #fed897;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fed897;
	box-shadow:inset 0px 1px 0px 0px #fed897;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f6b33d), color-stop(1, #d29105) );
	background:-moz-linear-gradient( center top, #f6b33d 5%, #d29105 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6b33d', endColorstr='#d29105');
	background-color:#f6b33d;
	-webkit-border-top-left-radius:20px;
	-moz-border-radius-topleft:20px;
	border-top-left-radius:20px;
	-webkit-border-top-right-radius:20px;
	-moz-border-radius-topright:20px;
	border-top-right-radius:20px;
	-webkit-border-bottom-right-radius:20px;
	-moz-border-radius-bottomright:20px;
	border-bottom-right-radius:20px;
	-webkit-border-bottom-left-radius:20px;
	-moz-border-radius-bottomleft:20px;
	border-bottom-left-radius:20px;
	text-indent:0;
	border:1px solid...

JavaScript

/********************************************************************
  *
  * Fourth problem: Sum of first 12 even Fibonacci numbers
  *
  ********************************************************************/
// first we get the HTML for the button
var getFibSum = document.getElementById("sumFib");

getFibSum.onclick = function(){
               document.getElementById("sumFibResult").innerHTML = twelveEvenFibonacciSum();
 }

 function twelveEvenFibonacciSum(){
     
 console.clear();
                
        var fib = [0, 1]; //Initialize array
        var sum = 0;
        var counter = 0;
        
            for (var i= 2; i <= 50; i++) {         
                    fib[i] = fib[i-1] + fib[i-2];    
                    var integer = fib[i];
                    if(integer  % 2 == 0) {

                         // sums up the totol of my fib even numbers
                         var sumFibResult = sum += fib[i];
                        console.log("shows the numbers being added together " + sumFibResult);
                        counter++;
                    }
                // Loops 12 times checking for even numbers
                if(counter >= 11) {
                   return sumFibResult;
                }
            } console.log(fib);
 }
 
 
//Code was modified throught what I learned in Robert's lessons - excellent instructions