Difference between revisions of "Template:Northeastern Boston/Javascript"

 
(6 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<script>
 
<script>
−
 
−
changeSVGChildrenColor = function(element, color) {
 
−
$(element).children().each(function ()
 
−
{ $(this).css('fill', color); }
 
−
)
 
−
}
 
−
 
 
$(document).ready(function() {
 
$(document).ready(function() {
−
$('#comingSoon').height($(window).height());
+
$('.tab-container').on("click", function() {
−
});
+
$(this).toggleClass('tab-show');
 +
$(this).toggleClass('tab-hide');
  
−
document.getElementById("comingSoon").addEventListener("load", function() {
+
var arrow = $(this).find('.tab-container__arrow')[0];
−
    logo = this.getElementById('Logo_Logo');
+
$(arrow).toggleClass('flip-vertical');
−
    colorGradient(logo,'#26db80','#50e2de', 10, 30);
+
});
−
});
+
  
−
colorGradient = function (element, start, stop, numberOfColors, opm) {
+
$('.sub-nav__parent').on("click", function() {
−
var numberOfItems = numberOfColors;
+
// Toggle active navbar
−
var rainbow = new Rainbow();
+
//$('.active').toggleClass('active');
−
rainbow.setNumberRange(1, numberOfItems);
+
−
rainbow.setSpectrum(start, stop);
+
−
var colors = [];
+
−
for (var i = 1; i <= numberOfItems; i++) {
+
−
    var hexColour = rainbow.colourAt(i);
+
−
    colors[i - 1] = '#' + hexColour;
+
−
}
+
−
var reversed = [];
+
−
$(colors).each(function(i) {reversed[i] = this});
+
−
reversed.reverse();
+
−
oscillation =  jQuery.merge(colors, reversed);
+
−
+
  
−
/*var interval = setInterval(function () {changeColor(element, oscillation[i % (numberOfColors * 2)]);}, 1000}); */
+
// Toggle active of current nav element
−
var i = 0;
+
//var link = $(this).children()[0];
−
var interval = setInterval(function ()  
+
//$(link).toggleClass('active');
−
{ changeSVGChildrenColor(element, oscillation[i % (numberOfColors * 2)]);
+
−
i += 1;
+
−
}, 300);
+
  
−
}
+
// Toggle hiding of children nav elements
 +
var sibling = $(this).siblings()[0];
 +
$(sibling).toggleClass('hidden');
  
−
var xhr = new XMLHttpRequest();
+
var arrow = $(this).find('.nav-container__arrow')[0];
−
xhr.open("GET", "https://www.codecademy.com/", false);
+
$(arrow).toggleClass('flip-vertical');
−
xhr.send();
+
});
  
−
console.log(xhr.status);
+
$('.minimal-dropdown__arrow').on("click", function() {
−
console.log(xhr.statusText);
+
$(this).toggleClass('fa-flipped-arrow');
 +
$(this).parent().parent().find('.minimal-dropdown__content').toggleClass('hidden');
 +
});
  
−
changeColor = function(element, color) {
+
});
−
$(element).css('color', color);
+
−
}
+
  
  
 
</script>
 
</script>
 
</html>
 
</html>

Latest revision as of 00:46, 18 September 2015